Как вывести список свойств объекта JavaScript? - PullRequest
772 голосов
/ 16 октября 2008

Скажем, я создаю объект таким образом:

var myObject =
        {"ircEvent": "PRIVMSG", "method": "newURI", "regex": "^http://.*"};

Каков наилучший способ получить список имен свойств? то есть я хотел бы получить несколько переменных ключей, таких как:

keys == ["ircEvent", "method", "regex"]

Ответы [ 16 ]

987 голосов
/ 16 октября 2008

В современных браузерах (IE9 +, FF4 +, Chrome5 +, Opera12 +, Safari5 +) вы можете использовать встроенный Object.keys метод:

var keys = Object.keys(myObject);

Выше есть полное заполнение, но упрощенная версия:

var getKeys = function(obj){
   var keys = [];
   for(var key in obj){
      keys.push(key);
   }
   return keys;
}

В качестве альтернативы замените var getKeys на Object.prototype.keys, чтобы позволить вам вызвать .keys() для любого объекта. Расширение прототипа имеет некоторые побочные эффекты, и я бы не рекомендовал это делать.

245 голосов
/ 16 октября 2008

Как указывало slashnick , вы можете использовать конструкцию for для итерации объекта по его именам атрибутов. Однако вы будете перебирать все имена атрибутов в цепочке прототипов объекта. Если вы хотите перебрать только по собственным атрибутам объекта, вы можете использовать метод Object # hasOwnProperty () . Таким образом, имея следующее.

for (var key in obj) {
    if (obj.hasOwnProperty(key)) {
        /* useful code here */
    }
}
97 голосов
/ 15 октября 2010

Как ответил Сэм Даттон, новый метод для этой цели был введен в 5-м издании ECMAScript. Object.keys() будет делать то, что вы хотите, и поддерживается в Firefox 4 , Chrome 6, Safari 5 и IE 9 .

Вы также можете очень легко реализовать метод в браузерах, которые его не поддерживают. Однако некоторые реализации не полностью совместимы с Internet Explorer. Вот более совместимое решение:

Object.keys = Object.keys || (function () {
    var hasOwnProperty = Object.prototype.hasOwnProperty,
        hasDontEnumBug = !{toString:null}.propertyIsEnumerable("toString"),
        DontEnums = [ 
            'toString', 'toLocaleString', 'valueOf', 'hasOwnProperty',
            'isPrototypeOf', 'propertyIsEnumerable', 'constructor'
        ],
        DontEnumsLength = DontEnums.length;

    return function (o) {
        if (typeof o != "object" && typeof o != "function" || o === null)
            throw new TypeError("Object.keys called on a non-object");

        var result = [];
        for (var name in o) {
            if (hasOwnProperty.call(o, name))
                result.push(name);
        }

        if (hasDontEnumBug) {
            for (var i = 0; i < DontEnumsLength; i++) {
                if (hasOwnProperty.call(o, DontEnums[i]))
                    result.push(DontEnums[i]);
            }   
        }

        return result;
    };
})();

Обратите внимание, что в настоящее время принятый ответ не включает проверку для hasOwnProperty () и возвращает свойства, унаследованные через цепочку прототипов. Он также не учитывает известную ошибку DontEnum в Internet Explorer, когда неперечислимые свойства в цепочке прототипов приводят к тому, что локально объявленные свойства с тем же именем наследуют свой атрибут DontEnum.

Реализация Object.keys () даст вам более надежное решение.

РЕДАКТИРОВАТЬ: после недавнего обсуждения с kangax , известным автором Prototype, я реализовал обходной путь для ошибки DontEnum на основе кода для его найденной функции Object.forIn() здесь .

28 голосов
/ 29 сентября 2010

Обратите внимание, что Object.keys и другие методы ECMAScript 5 поддерживаются в Firefox 4, Chrome 6, Safari 5, IE 9 и выше.

Например:

var o = {"foo": 1, "bar": 2}; 
alert(Object.keys(o));

Таблица совместимости ECMAScript 5: http://kangax.github.com/es5-compat-table/

Описание новых методов: http://markcaudill.com/index.php/2009/04/javascript-new-features-ecma5/

21 голосов

Object.getOwnPropertyNames(obj)

Эта функция также показывает не перечисляемые свойства в дополнение к тем, которые показаны Object.keys(obj).

В JS каждое свойство имеет несколько свойств, включая логическое enumerable.

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

Пример:

var o = Object.create({base:0})
Object.defineProperty(o, 'yes', {enumerable: true})
Object.defineProperty(o, 'not', {enumerable: false})

console.log(Object.getOwnPropertyNames(o))
// [ 'yes', 'not' ]

console.log(Object.keys(o))
// [ 'yes' ]

for (var x in o)
    console.log(x)
// yes, base

Также обратите внимание, как:

  • Object.getOwnPropertyNames и Object.keys не поднимитесь по цепочке прототипов, чтобы найти base
  • for in делает

Подробнее о прототипе цепи здесь: https://stackoverflow.com/a/23877420/895245

16 голосов
/ 13 января 2010

Я большой поклонник функции дампа.

http://ajaxian.com/archives/javascript-variable-dump-in-coldfusion alt text

14 голосов
/ 14 декабря 2012

Может сделать это с помощью jQuery следующим образом:

var objectKeys = $.map(object, function(value, key) {
  return key;
});
9 голосов
/ 01 марта 2012

если вы пытаетесь получить только элементы, но не функции, тогда этот код может помочь вам

this.getKeys = function() {

    var keys = new Array();
    for(var key in this) {

        if( typeof this[key] !== 'function') {

            keys.push(key);
        }
    }
    return keys;
}

это часть моей реализации HashMap, и мне нужны только ключи, "this" - это объект hashmap, содержащий ключи

8 голосов
/ 13 июля 2012

Это будет работать в большинстве браузеров, даже в IE8, и никаких библиотек не требуется. var i - твой ключ.

var myJSONObject =  {"ircEvent": "PRIVMSG", "method": "newURI", "regex": "^http://.*"}; 
var keys=[];
for (var i in myJSONObject ) { keys.push(i); }
alert(keys);
7 голосов
/ 27 ноября 2012

Под браузерами, поддерживающими js 1.8:

[i for(i in obj)]
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...