Как правильно проверить, что свойство объекта в JavaScript является undefined?

Понимание разницы между «свойство не существует» и «свойство равно undefined»

Это отличный вопрос, который часто путает новичков. В JavaScript есть три принципиально разных состояния для свойства объекта:

• Свойство не существует — ключа нет в объекте вообще
• Свойство существует, но равно undefined — ключ есть, его значение — undefined
• Свойство существует и имеет другое значение (число, строка, null и т.д.)

Рассмотрим пример:

const obj = {
  a: 1,
  b: undefined,
  c: null
};

// obj.d не существует

Способ 1: Оператор in — проверка существования свойства

Оператор in проверяет, существует ли свойство в объекте (включая прототип). Он возвращает true даже если значение свойства — undefined.

console.log('a' in obj); // true (существует, значение 1)
console.log('b' in obj); // true (существует, значение undefined)
console.log('c' in obj); // true (существует, значение null)
console.log('d' in obj); // false (не существует)

Когда использовать: когда вам нужно узнать, объявлено ли свойство вообще, независимо от его значения.

Способ 2: Оператор === undefined — проверка значения

Прямое сравнение со значением undefined проверяет, равно ли текущее значение свойства undefined. Но есть нюанс: если свойство не существует, JavaScript вернет undefined при попытке доступа к нему.

console.log(obj.a === undefined); // false (значение 1)
console.log(obj.b === undefined); // true (значение undefined)
console.log(obj.c === undefined); // false (значение null)
console.log(obj.d === undefined); // true (свойства нет, но доступ вернул undefined)

Проблема: вы не можете отличить случай «свойство равно undefined» от «свойства не существует». Оба вернут true.

Когда использовать: когда разница между «не существует» и «равно undefined» для вас не важна. Например, при проверке опциональных параметров.

Способ 3: typeof — безопасная проверка на undefined

typeof — самый безопасный способ. Он никогда не выбрасывает ошибку, даже если переменная не объявлена (но для свойств объекта это не актуально).

console.log(typeof obj.a === 'undefined'); // false
console.log(typeof obj.b === 'undefined'); // true
console.log(typeof obj.c === 'undefined'); // false (null — это object)
console.log(typeof obj.d === 'undefined'); // true

Недостаток: как и === undefined, не различает «не существует» и «равно undefined».

Способ 4: hasOwnProperty — проверка собственных свойств

Метод hasOwnProperty проверяет, существует ли свойство непосредственно в объекте (не в прототипе).

console.log(obj.hasOwnProperty('a')); // true
console.log(obj.hasOwnProperty('b')); // true
console.log(obj.hasOwnProperty('d')); // false

Когда использовать: когда нужно проверить только собственные свойства, игнорируя унаследованные. Например, при работе с сериализацией данных.

Идеальное решение для разных сценариев

Если вам нужно точно отличить все три случая, используйте комбинацию:

function checkProperty(obj, prop) {
  if (!(prop in obj)) {
    return 'свойство не существует';
  }
  if (obj[prop] === undefined) {
    return 'свойство существует, но равно undefined';
  }
  return 'свойство существует со значением: ' + obj[prop];
}

console.log(checkProperty(obj, 'a')); // свойство существует со значением: 1
console.log(checkProperty(obj, 'b')); // свойство существует, но равно undefined
console.log(checkProperty(obj, 'd')); // свойство не существует

Практические рекомендации

• Используйте in, если нужно проверить существование ключа (включая прототип)
• Используйте hasOwnProperty для проверки собственных свойств
• Используйте === undefined или typeof для проверки значения, когда неважно, существует ли свойство
• Избегайте явного присваивания undefined свойствам — лучше используйте null для обозначения «пустого» значения

const user = {
  name: 'Иван',
  address: null
};

// Без Optional Chaining — ошибка!
// console.log(user.address.city); // TypeError

// С Optional Chaining — безопасно
console.log(user.address?.city); // undefined

const config = {
  timeout: 0,
  retries: null
};

// Проблема с ||: 0 считается falsy
const timeout1 = config.timeout || 1000; // 1000 (неправильно!)

// Решение с ??: проверяет только null/undefined
const timeout2 = config.timeout ?? 1000; // 0 (правильно!)
const retries = config.retries ?? 3; // 3 (null заменен)

// Проверка существования и получение значения по умолчанию
const email = user?.email ?? 'email не указан';
console.log(email); // 'email не указан' если свойства нет или оно undefined/null