- как проверить свойство в объекте js
- Object.prototype.hasOwnProperty()
- Try it
- Syntax
- Parameters
- Return value
- Description
- Examples
- Using hasOwnProperty to test for an own property’s existence
- Direct vs. inherited properties
- Iterating over the properties of an object
- Using hasOwnProperty as a property name
- Objects created with Object.create(null)
- Specifications
- Browser compatibility
- See also
- Found a content problem with this page?
- Проверка наличия свойств
- Оператор in
- 3 способа проверить в JavaScript, есть ли у объекта свойство
- 1. Метод hasOwnProperty()
- 2. Оператор in
- 3. Сравнение с undefined
- 4. Заключение
как проверить свойство в объекте js
Для проверки наличия свойства в объекте в JavaScript можно использовать оператор in или метод объекта hasOwnProperty() .
Например, у нас есть объект person с некоторыми свойствами, и мы хотим узнать, есть ли у него свойство name . Мы можем использовать оператор in следующим образом:
const person = age: 25, gender: 'female' >; if ('name' in person) console.log('У объекта есть свойство name'); > else console.log('У объекта нет свойства name'); >
Если свойство name есть в объекте person , то в консоли будет выведено сообщение «У объекта есть свойство name», в противном случае выведется сообщение «У объекта нет свойства name».
Также мы можем использовать метод hasOwnProperty() объекта person :
const person = age: 25, gender: 'female' >; if (person.hasOwnProperty('name')) console.log('У объекта есть свойство name'); > else console.log('У объекта нет свойства name'); >
Результат работы этого кода будет аналогичен предыдущему.
Object.prototype.hasOwnProperty()
The hasOwnProperty() method returns a boolean indicating whether the object has the specified property as its own property (as opposed to inheriting it).
Note: Object.hasOwn() is recommended over hasOwnProperty() , in browsers where it is supported.
Try it
Syntax
Parameters
The String name or Symbol of the property to test.
Return value
Returns true if the object has the specified property as own property; false otherwise.
Description
The hasOwnProperty() method returns true if the specified property is a direct property of the object — even if the value is null or undefined . The method returns false if the property is inherited, or has not been declared at all. Unlike the in operator, this method does not check for the specified property in the object’s prototype chain.
The method can be called on most JavaScript objects, because most objects descend from Object , and hence inherit its methods. For example Array is an Object , so you can use hasOwnProperty() method to check whether an index exists:
const fruits = ["Apple", "Banana", "Watermelon", "Orange"]; fruits.hasOwnProperty(3); // true ('Orange') fruits.hasOwnProperty(4); // false - not defined
The method will not be available in objects where it is reimplemented, or on objects created using Object.create(null) (as these don’t inherit from Object.prototype ). Examples for these cases are given below.
Examples
Using hasOwnProperty to test for an own property’s existence
The following code shows how to determine whether the example object contains a property named prop .
const example = >; example.hasOwnProperty("prop"); // false example.prop = "exists"; example.hasOwnProperty("prop"); // true - 'prop' has been defined example.prop = null; example.hasOwnProperty("prop"); // true - own property exists with value of null example.prop = undefined; example.hasOwnProperty("prop"); // true - own property exists with value of undefined
Direct vs. inherited properties
The following example differentiates between direct properties and properties inherited through the prototype chain:
const example = >; example.prop = "exists"; // `hasOwnProperty` will only return true for direct properties: example.hasOwnProperty("prop"); // true example.hasOwnProperty("toString"); // false example.hasOwnProperty("hasOwnProperty"); // false // The `in` operator will return true for direct or inherited properties: "prop" in example; // true "toString" in example; // true "hasOwnProperty" in example; // true
Iterating over the properties of an object
The following example shows how to iterate over the enumerable properties of an object without executing on inherited properties.
const buz = fog: "stack", >; for (const name in buz) if (buz.hasOwnProperty(name)) console.log(`this is fog ($name>) for sure. Value: $buz[name]>`); > else console.log(name); // toString or something else > >
Note that the for. in loop only iterates enumerable items: the absence of non-enumerable properties emitted from the loop does not imply that hasOwnProperty itself is confined strictly to enumerable items (as with Object.getOwnPropertyNames() ).
Using hasOwnProperty as a property name
JavaScript does not protect the property name hasOwnProperty ; an object that has a property with this name may return incorrect results:
const foo = hasOwnProperty() return false; >, bar: "Here be dragons", >; foo.hasOwnProperty("bar"); // re-implementation always returns false
The recommended way to overcome this problem is to instead use Object.hasOwn() (in browsers that support it). Other alternatives include using an external hasOwnProperty :
const foo = bar: "Here be dragons" >; // Use Object.hasOwn() method - recommended Object.hasOwn(foo, "bar"); // true // Use the hasOwnProperty property from the Object prototype Object.prototype.hasOwnProperty.call(foo, "bar"); // true // Use another Object's hasOwnProperty // and call it with 'this' set to foo (>).hasOwnProperty.call(foo, "bar"); // true
Note that in the first two cases there are no newly created objects.
Objects created with Object.create(null)
Objects created using Object.create(null) do not inherit from Object.prototype , making hasOwnProperty() inaccessible.
const foo = Object.create(null); foo.prop = "exists"; foo.hasOwnProperty("prop"); // Uncaught TypeError: foo.hasOwnProperty is not a function
The solutions in this case are the same as for the previous section: use Object.hasOwn() by preference, otherwise use an external object’s hasOwnProperty() .
Specifications
Browser compatibility
BCD tables only load in the browser
See also
Found a content problem with this page?
This page was last modified on May 1, 2023 by MDN contributors.
Your blueprint for a better internet.
Проверка наличия свойств
Осваивайте профессию, начните зарабатывать, а платите через год!
Курсы Python Акция! Бесплатно!
Станьте хакером на Python за 3 дня
Веб-вёрстка. CSS, HTML и JavaScript
Станьте веб-разработчиком с нуля
Часто при работе с объектом полезно проверить, что содержится в этом объекте, есть ли в нём свойство с заданным именем и какое это свойство. Данную процедуру можно проделать с помощью оператора in и с помощью методов hasOwnProperty() и propertyIsEnumerable() или просто обратившись к свойству.
Оператор in
Оператор in принимает имя свойства (в виде строки) в левом операнде и объект в правом операнде. Оператор in возвращает true , если свойство содержится в указанном объекте или в его цепочке прототипов:
На заметку: Значение свойства в левом операнде оператора in заключается в двойные кавычки – то есть на самом деле указывается текстовая строка с названием свойства. Так же мы поступаем, когда к свойству объекта обращаемся с использованием квадратных скобок, то есть при использовании команды вида объект[«свойство»].
Если вы удалили свойство при помощи оператора delete, то оператор in возвратит false для этого свойства:
3 способа проверить в JavaScript, есть ли у объекта свойство
От автора: из-за динамической природы JavaScript вам может потребоваться проверить, существует ли в объекте конкретное свойство. В этом посте вы узнаете о трех распространенных способах проверки наличия свойства в объекте.
1. Метод hasOwnProperty()
У объекта JavaScript есть специальный метод object.hasOwnProperty(propName), который возвращает логическое значение, указывающее, имеет object ли свойство propName. В следующем примере hasOwnProperty() определяется наличие свойств:
Свойство name существует в объекте hero: таким образом, hero.hasOwnProperty(‘name’) возвращается true.
Онлайн курс по JavaScript
Научитесь создавать приложения со сложными интерфейсами
Это основной язык для современной веб-разработки — почти 100% сайтов работает на JavaScript. Освойте его с нуля всего за 4 месяца, и вы сможете зарабатывать от 70 000 рублей.
С другой стороны, свойство realName не существует в объекте hero. Как и ожидалось, hero.hasOwnProperty(‘realName’) возвращается false — обозначает отсутствующее свойство.
Имя метода hasOwnProperty() предполагает, что он ищет свойства в собственных свойствах объекта. Проще говоря, собственными свойствами являются те, которые определены непосредственно для объекта.
Даже если у каждого объекта JavaScript есть унаследованное свойство toString (которое является методом, унаследованным от прототипа объекта), hasOwnProperty() оно не определяется как свойство:
2. Оператор in
Оператор in в propName in object также определяет, существует ли свойство propName в object. Давайте используем оператор in, чтобы определить существует ли свойство:
‘name’ in hero оценивается, как ожидается, true, потому что hero содержит свойство name. Однако hero не содержит свойства с именем ‘realName’. В результате ‘realName’ in hero оценивается, как false.
У оператора in короткий синтаксис, и я в большинстве случаев предпочитаю его методу hasOwnProperty(). Вот основное различие между методом hasOwnProperty() и оператором in: последний проверяет не только собственные свойства, но и список унаследованных свойств.
Вот почему, в отличие от hasOwnProperty(), оператор in обнаруживает, что унаследованное свойство toString существует в объекте hero:
3. Сравнение с undefined
Если вы обращаетесь к несуществующему свойству объекта, результат будет undefined. Давайте рассмотрим пример:
hero.realName оценивается undefined, потому что свойство realName отсутствует. Теперь вы можете понять идею: давайте сравним с undefined, чтобы определить наличие свойства.
hero.name !== undefined оценивается, как true, что показывает наличие свойства. С другой стороны, hero.realName !== undefined оценивается false, что указывает на отсутствие realName.
Я сравнивал с undefined, чтобы определить существование свойства в течение довольно долгого времени. Это простой, но грязный подход.
Обратите внимание, что этот подход может генерировать ложноотрицательный результат. Если свойство существует, но имеет значение undefined (этот случай, однако, встречается редко), сравнение с undefined оценивается неверно false:
Даже если свойство name существует (но имеет значение undefined), hero.name !== undefined оценивается как false: что неправильно указывает на отсутствие свойства.
4. Заключение
Есть 3 основных способа проверить, существует ли свойство. Первый способ — вызвать object.hasOwnProperty(propName). Метод возвращает true, если propName существует в object, и false в противном случае. Обратите внимание, что hasOwnProperty() выполняет поиск только в пределах собственных свойств объекта.
Второй подход использует оператор propName in object. Оператор оценивается true для существующего свойства, и false в противном случае. Оператор in ищет наличие свойств как в собственных, так и в унаследованных свойствах объекта.
Наконец, вы можете просто использовать object.propName !== undefined и сравнивать с undefined напрямую.
Автор: Dmitri Pavlutin
Онлайн курс по JavaScript
Научитесь создавать приложения со сложными интерфейсами
Это основной язык для современной веб-разработки — почти 100% сайтов работает на JavaScript. Освойте его с нуля всего за 4 месяца, и вы сможете зарабатывать от 70 000 рублей.
Редакция: Команда webformyself.