Проверка наличия свойств у объекта в JavaScript: методы
Пройдите тест, узнайте какой профессии подходите
Быстрый ответ
Для того чтобы определить, имеет ли объект собственные свойства, можно воспользоваться методом Object.keys(obj).length
. Если он возвращает ноль, это означает, что объект не обладает собственными свойствами.
Пример:
const isEmpty = Object.keys({}).length === 0; // true. У объекта отсутствуют свойства.
Избранный метод не учитывает свойства, унаследованные от прототипа. Он служит простым инструментом для проверки наличия исключительно собственных свойств объекта.
Подробности: альтернативные подходы
Учет неперечислимых свойств
Чтобы включить в расчет неперечислимые свойства, вы можете воспользоваться методом Object.getOwnPropertyNames(obj).length
. Он функционирует аналогично Object.keys
, но обладает расширенными возможностями.
Пример:
const hasNonEnumerable = Object.getOwnPropertyNames({prop: 'value'}).length > 0; // true. Невозможно скрыться от метода getOwnPropertyNames!
Проверка принадлежности конкретного свойства
Для того, чтобы проверить, принадлежит ли свойство данному объекту и не унаследовано ли оно, используйте метод hasOwnProperty()
.
Пример:
const object = { ownProp: 'exists' };
const hasOwn = object.hasOwnProperty('ownProp'); // true. Свойство обнаружено!
Подсчет пользовательских свойств
В случае необходимости подсчета только пользовательских свойств, можно использовать сочетание цикла for...in
и метода hasOwnProperty()
.
Пример:
let userDefinedPropertyCount = 0;
const object = { foo: 'bar', baz: 'qux' };
for (let key in object) {
if (object.hasOwnProperty(key)) {
userDefinedPropertyCount++;
}
}
Применение библиотек
Если вы работаете с jQuery, вы можете определить пустоту объекта при помощи метода $.isEmptyObject(obj)
, что будет соответствовать 'jQuery-стилю'.
Пример:
const isEmpty = $.isEmptyObject({}); // true. jQuery – не только средство работы с DOM!
Для среды ES5 рекомендуется использовать полифиллы для обеспечения поддержки устаревших браузеров, когда используются методы вроде Object.keys
.
Визуализация
Можно представить каждый объект как коробку:
Пустая коробка (📦): {}
// Коробка пуста, в объекте отсутствуют свойства.
Быстрый способ проверить содержимое выглядит следующим образом:
if (Object.keys(yourObject).length > 0) {
// В коробке что-то есть! 🎉
} else {
// Она пуста...🌬️ (свойств нет)
}
Примеры объектов и их содержимого:
Объект (📦) | Есть ли свойства внутри?
--------------- | -------------------
{ } | 🌬️ Нет
{ a:1 } | ✅ Да!
{ name:'Box' } | ✅ Безусловно!
Мельчайшие детали
Разбор цепочки прототипов
Важно различать унаследованные свойства и свойства, определенные пользователем. В этом знание цепочки прототипов будет бесценным.
Пример:
const base = { inheritedProp: 'inherited' };
const obj = Object.create(base);
obj.ownProp = 'own';
// Свойство 'inheritedProp' унаследовано, а 'ownProp' — это свойство, установленное самим объектом. Это похоже на своеобразные семейные особенности!
Управление видимостью свойств
С помощью Object.defineProperty
возможно управлять перечисляемостью свойств.
Пример:
const object = {};
Object.defineProperty(object, 'hidden', {
value: 'secret',
enumerable: false,
});
// Свойство 'hidden' не учитывается методом Object.keys(). Все идет по плану, свойство скрыто.
Обход особых ситуаций
Будьте внимательны к особым случаям, например, к объектам с унаследованными неперечислимыми свойствами, которые могут остаться незамеченными при подсчете.
Оптимизация функционала
Если часто осуществляется проверка, разумно инкапсулировать логику перечисления в функции, такие как, например, isObjectEmpty()
.
Пример:
function isObjectEmpty(obj) {
return Object.keys(obj).length === 0;
}
// Практичная функция для использования в коде.
Полезные материалы
- Object.keys() – JavaScript | MDN — документация MDN по методу
Object.keys()
. - How do I test for an empty JavaScript object? – Stack Overflow — дискуссия и рекомендации по определению пустого объекта в JavaScript.
- Node.js — ECMAScript 2015 (ES6) и далее — возможности ES6, влючая
Object.entries()
. - Lodash Documentation — функция
isEmpty
в Lodash для проверки на отсутствие свойств в объекте. - ECMAScript® 2024 Language Specification — спецификация метода
Object.getOwnPropertyNames()
. - GitHub – getify/You-Dont-Know-JS: Серия книг по JavaScript. @YDKJS в Twitter. — обширная серия книг о JavaScript, включая способы проверки свойства
undefined
в объектах.