Как правильно проверить переменную на undefined в JavaScript?

Правильная проверка на undefined: строгое сравнение и typeof

Вы на верном пути, но важно понимать нюансы. В JavaScript есть несколько способов проверки на undefined, и выбор зависит от контекста. Главное правило: всегда используйте строгое сравнение (===) или оператор typeof. Рассмотрим основные подходы.

1. Строгое сравнение с undefined (===)

Это самый прямолинейный способ, но он работает только для объявленных переменных. Если переменная не объявлена, вы получите ReferenceError.

let declaredVar;
console.log(declaredVar === undefined); // true

let initializedVar = 42;
console.log(initializedVar === undefined); // false

// ❌ Ошибка! Переменная notDeclared не объявлена
// console.log(notDeclared === undefined); // ReferenceError

2. Оператор typeof — универсальное решение

Оператор typeof безопасен даже для необъявленных переменных. Он возвращает строку, поэтому сравнивайте с 'undefined'.

let declaredVar;
console.log(typeof declaredVar === 'undefined'); // true

// ✅ Безопасно! Необъявленная переменная не вызовет ошибку
console.log(typeof notDeclared === 'undefined'); // true

3. Сравнение через void

Оператор void вычисляет выражение и возвращает undefined. Это редко используется, но полезно в некоторых случаях (например, для получения "чистого" undefined, если глобальная переменная undefined была перезаписана — в старом коде такое встречалось).

let myVar;
console.log(myVar === void 0); // true
console.log(void 0 === undefined); // true

4. Разница между == и ===

Никогда не используйте == для проверки на undefined, потому что он приводит типы. Например, null == undefined даёт true, что может привести к логическим ошибкам.

let empty = null;
console.log(empty == undefined); // true (неправильно!)
console.log(empty === undefined); // false (правильно)

5. Проверка свойств объектов

Для проверки, существует ли свойство у объекта, лучше использовать оператор in или метод hasOwnProperty, так как свойство может существовать, но иметь значение undefined.

const obj = { a: undefined, b: 42 };

// Проверка значения (не факта существования)
console.log(obj.a === undefined); // true
console.log(obj.c === undefined); // true (свойства нет, но ошибки нет)

// Проверка существования свойства
console.log('a' in obj); // true
console.log('c' in obj); // false
console.log(obj.hasOwnProperty('a')); // true

Рекомендация

• Для объявленных переменных: используйте === undefined.
• Для необъявленных переменных или максимальной безопасности: используйте typeof x === 'undefined'.
• Для свойств объектов: комбинируйте in и проверку значения.
• Избегайте == и сравнения с null для проверки на undefined.

В современном JavaScript (ES6+) с использованием let и const вы редко столкнётесь с необъявленными переменными, если пишете аккуратный код. Но знание typeof остаётся полезным для проверки глобальных переменных (например, typeof window !== 'undefined' в среде Node.js).

function greet(name) {
  const userName = name || 'Гость';
  console.log('Привет, ' + userName);
}

greet(); // Привет, Гость
greet('Анна'); // Привет, Анна
greet(0); // Привет, Гость (неожиданно, если 0 — допустимое значение)

function setCount(count) {
  const finalCount = count ?? 1; // только если count === undefined или null
  console.log('Счётчик:', finalCount);
}

setCount(); // Счётчик: 1
setCount(0); // Счётчик: 0 (сохранили ноль!)
setCount(null); // Счётчик: 1

const user = { profile: { name: 'Иван' } };

// Без optional chaining — ошибка, если profile нет
// const city = user.profile.city; // TypeError

// С optional chaining — безопасно
const city = user.profile?.city ?? 'Неизвестный город';
console.log(city); // Неизвестный город