Cannot read properties of undefined (reading 'trim')

Ошибка TypeError: Cannot read properties of undefined (reading 'trim') возникает, когда вы пытаетесь вызвать метод или прочитать свойство у переменной, которой присвоено значение undefined или null.

Обычно такая ошибка встречается в JavaScript, когда программа ожидает объект или строку, но по факту переменная не была инициализирована или стала неопределённой.

Наиболее частые причины появления этой ошибки

Обращение к свойствам объекта, который не определен
Например, вы вызвали метод .trim() на строке, но строка оказалась равна undefined:

ВыделитьJavaScript

let myVar = undefined;
console.log(myVar.trim()); // Uncaught TypeError: Cannot read properties of undefined (reading 'trim')

Несуществующие элементы DOM
Если вы пытаетесь манипулировать элементом, который не существует в документе:

ВыделитьJavaScript

const element = document.querySelector('.nonexistent-class');
console.log(element.textContent.trim()); // Uncaught TypeError: Cannot read properties of null (reading 'trim')

Поддержка устаревших версий браузера
Старые версии браузеров могут не поддерживать современные методы или классы. Например, если вы случайно вызываете .trim() на объектах, которые не поддерживали этот метод ранее.

Как исправить данную ошибку

Проверяйте существование переменной перед вызовом метода

ВыделитьJavaScript

let str = someFunctionThatReturnsValue();
if (typeof str === 'string') {
    console.log(str.trim());
} else {
    console.error('Expected a string but got:', typeof str);
}

Используйте оператор optional chaining (?.)
Начиная с ES2020, можно безопасно вызывать методы на неопределённых объектах с помощью опционального оператора цепочки:

ВыделитьJavaScript

const result = data?.trim() || '';
console.log(result);

Обрабатывайте случаи, когда элемент не найден
Если вы ищете элемент на странице, обязательно проверяйте, существует ли он:

ВыделитьJavaScript

const element = document.querySelector('.my-element');
if (element) {
    console.log(element.textContent.trim());
} else {
    console.warn('Element not found!');
}

Работайте с объектами осторожно
Если вы уверены, что переменная должна быть объектом, убедитесь, что она установлена корректно:

ВыделитьJavaScript

let obj = {};
obj.name = 'John Doe';
console.log(obj.name.trim()); // Всё хорошо

let anotherObj = null;
try {
    console.log(anotherObj.name.trim()); // Приведет к ошибке
} catch(e) {
    console.error('Ошибка:', e.message);
}

Итог

Типичный сценарий ошибки — попытка чтения свойств у переменной, которая равна undefined или null. Решением является предварительная проверка существования переменной или использование безопасного оператора цепочки (?.).