Проверка существования свойства объекта через переменную в JS

Быстрый ответ

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

• Оператор in, который позволяет проверить всю цепочку прототипов объекта:

let prop = 'key', obj = { key: 'value' };
let exists = prop in obj; // obj подтвердит наличие 'key'

• Метод hasOwnProperty(), который анализирует только сам объект, не обращаясь к прототипам:

let prop = 'key', obj = { key: 'value' };
let exists = obj.hasOwnProperty(prop); // obj подтвердит, что у него есть 'key'

Использование оператора in имеет несколько преимуществ, включая удобство работы с динамическими именами свойств и устранение риска, связанного с переопределением метода hasOwnProperty.

Использование динамических имен свойств

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

let propertyName = 'dynamicKey';
let exists = propertyName in obj; // obj поддерживает динамические имена

Если вы ищете свойство во вложенном объекте, используйте следующий подход:

let nestedProp = 'innerKey';
// Обязательно проверьте, что obj[nestedProperty] существует
let exists = obj[nestedProperty] && nestedProp in obj[nestedProperty];

Особенности проверки свойств

Несмотря на похожую простоту, имеются некоторые нюансы, которыми стоит воспользоваться. Например, если метод hasOwnProperty() был переопределен, то его можно вызвать через Object.prototype:

let exists = Object.prototype.hasOwnProperty.call(obj, prop);

Во имя безопасности откажитесь от идеи использовать функцию eval для динамической проверки свойств. Скобочная нотация и оператор in — это надежные и безопасные инструменты.

Проверка наличия свойства и его типа

Используя оператор typeof, можно не только определить наличие свойства, но и его тип:

let typeCheck = typeof obj[prop] !== "undefined";

Однако важно учесть, что наличие свойства не всегда говорит о том, что оно истинно:

let propertyFeature = 'optionalFeature';
if (obj[propertyFeature]) {
  // Свойство присутствует и оно истинно!
} else {
  // Свойства нет либо оно ложно
}

Помните, что необходимо вокруг имени свойства ставить кавычки при использовании метода hasOwnProperty и оператора in.

Визуализация

В качестве наглядного примера возьмем объект "дом" с различными комнатами и ключ, указывающий на одну из них:

Дом: {Зал: "да", Кухня: "да", Ванная: "да", Спальня: "да"}
Ключ: [ "Гостевая" ]

Требуется выяснить, есть ли в доме комната, название которой указано на ключе:

const house = {"Зал": "да", "Кухня": "да", "Ванная": "да", "Спальня": "да"};
const roomKey = "Гостевая";

Существует ли данная комната?

if (roomKey in house) {
  //🔓 Дверь открыта
  **Доступ разрешен! Добро пожаловать!**
} else {
  //🔒 Комната не найдена
  **Доступ запрещен! Такой комнаты не существует**
}

Вот так просто можно визуализировать подход.

hasOwnProperty против in – сопоставление подходов

Выбор между hasOwnProperty и in будет определяться вашей целью:

• hasOwnProperty подойдет, когда необходимо ограничить проверку лишь самим объектом, не затрагивая его прототипы.
• in будет уместно в случаях, когда требуется учитывать унаследованные свойства или динамические имена свойств.

Если hasOwnProperty был переопределен, можете проверить его через Object.prototype:

let exists = Object.prototype.hasOwnProperty.call(obj, prop);

Зная эту разницу, можно эффективнее работать с проверкой свойств и избегать ошибок.

Полезные материалы

1. in – JavaScript | MDN — подробное описание оператора in.
2. Object.prototype.hasOwnProperty() – JavaScript | MDN — руководство по методу hasOwnProperty для надежной проверки свойств объекта.
3. How do I check if an object has a key in JavaScript? – Stack Overflow — практические примеры и решения от участников сообщества.
4. Reflect.has() – JavaScript | MDN — пример применения метода Reflect.has для проверки свойств.
5. Truthy – Glossary | MDN — объяснение "истинности" в контексте проверки свойств.
6. Объекты – JavaScript.info — подробный обзор темы объектов для полного понимания проверки свойств.
7. no-prototype-builtins – ESLint – Pluggable JavaScript Linter — лучшие практики по работе со свойствами объекта.