Проверка существования свойства объекта в JavaScript

Далее приведены все из них с примерами, так что давайте начнём.

1. Оператор in

Оператор in возвращает true, если указанное свойство присутствует внутри объекта или в цепочке его прототипов. Оператор in работает и для объектов, созданных статическим методом Object.create().

const person = {
  name: 'John',
  surname: 'Doe',
  age: 41
};

const hasLocation = 'location' in person;
if (hasLocation) {
  console.log("We have the location data");
} else {
  console.log("We don't have the location data")
}

// Результат:
// We don't have the location data

const user = Object.create({ name: 'Donald' });
console.log('name' in user); // true

2. Метод Object.prototype.hasOwnProperty()

Здесь мы можем использовать метод экземпляра объекта hasOwnProperty(), чтобы проверить, содержит ли объект определённое свойство.

Хотя функция Object.prototype.hasOwnProperty() уже давно присутствует в спецификации JavaScript, она имеет ряд недостатков. hasOwnProperty() не работает для объектов, созданных с помощью Object.create(null), поскольку они не наследуются от Object.prototype, что делает hasOwnProperty() недоступной для созданного объекта. При использовании hasOwnProperty() объект выбросит исключение.

const person = {
  name: 'John',
  surname: 'Doe',
  age: 41
};

const hasName = person.hasOwnProperty('name');
if (hasName) {
  console.log(`We have name property, value ${person.name}`);
} else {
  console.log("We don't have name property");
}
// Результат:
// We have name property, value John

const user = Object.create({ name: 'Paul' });
console.log(user.hasOwnProperty('name')); // false

3. Метод Object.hasOwn()

В рамках версии ECMAScript 2022 в классе Object появился статический метод hasOwn(). Метод Object.hasOwn() рекомендуется использовать вместо hasOwnProperty() в тех браузерах, где он поддерживается. Object.hasOwn() является альтернативой методу Object.prototype.hasOwnProperty().

const person = {
  name: 'John',
  surname: 'Doe',
  age: 41
};
const hasAge = Object.hasOwn(person, 'age');
if (hasAge) {
  console.log(`We have age property, value ${person.age}`);
} else {
  console.log("We don't have age property");
}

// Результат:
// We have age property, value 41

const user = Object.create({ name: 'Jorge' });
console.log(Object.hasOwn(person, 'name')); // true

4. Проверка на неопределённое значение

Когда мы пытаемся обратиться к несуществующему свойству объекта, то в результате получаем неопределённое значение. Поэтому мы можем использовать подход и делать что-то только тогда, когда значение свойства не является неопределённым.

const person = {
  name: 'John',
  surname: 'Doe',
  age: 41
};
if (person.location !== undefined) {
  // выполнить какую-то операцию
} else {
  console.log('Location property is not present on person object');
}

5. Методы Object.keys() и Array.prototype.some()

В данном подходе используются методы Object.keys() и Array.prototype.some().

По сути, мы преобразуем объект в массив свойств, а затем у нас есть некий метод с предикатной функцией, в котором мы проверяем наличие имени целевого свойства. Этот метод имеет тот же недостаток, что и Object.prototype.hasOwnProperty(), поскольку мы не можем найти свойство объекта, если объект создан с помощью метода Object.create().

const person = {
  name: 'John',
  surname: 'Doe',
  age: 41
};

const hasSurname = Object.keys(person).some(key => key === 'surname');
console.log(hasSurname); // true

const user = Object.create({ name: 'Thomas' });
const hasName = Object.keys(user).some(property => property === 'name');
console.log(hasName); // false

6. Пользовательская утилитарная функция JavaScript

Эта функция hasKey() принимает аргументы имени объекта и имени целевого свойства, и если оба аргумента определены, то мы выполняем цикл for-in по объекту и внутри каждой итерации проверяем, равен ли текущий ключ свойства целевому (входной параметр).

const person = {
  name: 'John',
  surname: 'Doe',
  age: 41
};

const user = Object.create({ name: 'Kevin' });

function hasKey(object, target) {
  if (object && target) {
    for (const key in object) {
      if (key === target) {
        return true;
      }
    }
    return false;
  } else {
    return false;
  }
}

console.log(hasKey(person, 'name')); // true
console.log(hasKey(person, 'location')); // false
console.log(hasKey(user, 'name')); // true

Заключение

В целом, владение объектами JavaScript необходимо для веб-разработки.

Как видите, у нас есть множество вариантов, когда необходимо проверить наличие свойства внутри конкретного объекта JavaScript. По моему опыту, оператор in и метод Object.hasOwn() — это те методы, которых мы должны придерживаться в повседневной работе. Также, если у нас по каким-то причинам нет версии ECMAScript 2022, мы можем использовать оператор in или проверку на неопределённое значение.