JavaScript метод Object.keys()

Определение и применение

JavaScript метод keys() позволяет вернуть массив, содержащий имена всех собственных (неунаследованных) перечислимых свойств и методов указанного объекта.

Под перечислимыми свойствами стоит понимать те, атрибут enumerable которых имеет значение true, вследствие чего они будут перечислимы в циклах, например в цикле for...in. Атрибуты в свою очередь описываются дескрипторами свойств – это обычные объекты JavaScript, которые описывают атрибуты и значение свойства. Подробную информацию о дескрипторах свойств и атрибутах вы можете получить в описании метода defineProperty(), который позволяет определить новое или изменить существующее свойство объекта, описывая его дескрипторами.

Если Вам необходимо вернуть массив, состоящий из всех имен собственных (неунаследованных) свойств и методов объекта (включая неперечислимые свойства), то Вы можете воспользоваться методом getOwnPropertyNames().

null и undefined вызывают TypeError; другие примитивы преобразуются в объекты-обёртки. Строка имеет собственные перечислимые индексные свойства.

Учитываются только собственные перечислимые свойства со строковыми ключами; символьные ключи пропускаются.

Поддержка браузерами

Спецификация: ecma262

✓Поддерживается во всех основных браузерах с 2015 года.

Показать браузеры

ВсеКомпьютерыМобильные

Совместимостьjavascript.builtins.Object.keys

Возможность	Компьютеры					Мобильные
	ChromeChrome	EdgeEdge	FirefoxFirefox	OperaOpera	SafariSafari	Chrome AndroidChromeAndroid	Firefox for AndroidFirefoxAndroid	Opera AndroidOperaAndroid	Safari on iOSSafariiOS	Samsung BrowserSamsungAndroid	WebView AndroidWebViewAndroid	WebView on iOSWebViewiOS
keys	✓5	✓12	✓4	✓12	✓5	✓18	✓4	✓12	✓5	✓1.0	✓4.4	✓5

✓поддерживается◐с ограниченияминет поддержки?нет данных≤31 — не позднее версии 31

JavaScript синтаксис

Object.keys( obj );

Спецификация

ECMAScript: Object.keys()

Значения параметров

Исключения

Примеры, попробуйте сами

В примере «Перечислимые ключи объекта, массива и строки» показан результат вызова метода.

<!doctype html>
<html lang="ru">
  <head>
    <meta charset="UTF-8" />
    <title>Перечислимые ключи объекта, массива и строки</title>
  </head>
  <body>
    <p>Результат выполнения выводится в консоль.</p>
  </body>
</html>

let obj = {
    // инициализируем переменную, содержащую объект
    a: 1,
    b: 2,
    c() {
        return this.a + this.b
    },
}
let arr = ['a', 'b', 'c'] // инициализируем переменную, содержащую массив
let str = 'string' // инициализируем переменную, содержащую строку

// возвращаем массив, состоящий из всех имен собственных свойств и методов объекта

console.log(Object.keys(obj)) // ["a", "b", "c"]
console.log(Object.getOwnPropertyNames(obj)) // ["a", "b", "c"]

console.log(Object.keys(arr)) // ["0", "1", "2"]
console.log(Object.getOwnPropertyNames(arr)) // ["0", "1", "2", "length"]

console.log(Object.keys(str)) // ["0", "1", "2", "3", "4", "5"]
console.log(Object.getOwnPropertyNames(str)) // ["0", "1", "2", "3", "4", "5", "length"]

В этом примере мы инициализировали три переменные, содержащие объект, массив и строку. В первом случае с помощью метода keys() мы возвращаем массив, состоящий из всех имен собственных (неунаследованных) перечислимых свойств и методов объекта. Обратите внимание, что при вызове метода на строке и массиве, переменная сначала приводится к объекту.

Обратите внимание на отличие вызова методов keys() и getOwnPropertyNames(), метод getOwnPropertyNames() возвращает так же неперечислимые свойства и методы, в данном случае свойство length неперечислимо (имеет значение атрибута enumerable равное false), а метод keys() возвращает только собственные (неунаследованные) перечислимые свойства и методы.

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

В примере «Количество собственных перечислимых ключей» показан результат вызова метода.

<!doctype html>
<html lang="ru">
  <head>
    <meta charset="UTF-8" />
    <title>Количество собственных перечислимых ключей</title>
  </head>
  <body>
    <p>Результат выполнения выводится в консоль.</p>
  </body>
</html>

let obj = {
    // инициализируем переменную, содержащую объект
    a: 1,
    b: 2,
    c() {
        return this.a + this.b
    },
}

// получаем массив, состоящий из всех имен собственных свойств и методов объекта и получаем его длину

let count = Object.keys(obj).length
console.log(count) // 3