如何列出 JavaScript 对象的属性?

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

答案

在现代浏览器(IE9 +,FF4 +,Chrome5 +,Opera12 +,Safari5 +)中,您可以使用内置的Object.keys方法:

var keys = Object.keys(myObject);

上面有完整的 polyfill,但简化的版本是:

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

或者,将Object.prototype.keys替换为var getKeys ,以允许您在任何对象上调用.keys() 。扩展原型会产生一些副作用,我不建议您这样做。

正如slashnick 所指出的,您可以使用 “for in” 构造来遍历对象的属性名称。但是,您将遍历对象原型链中的所有属性名称。如果你想在对象自身的属性进行迭代,你可以利用的对象#hasOwnProperty()方法。因此具有以下。

for (var key in obj) {
    if (obj.hasOwnProperty(key)) {
        /* useful code here */
    }
}

正如 Sam Dutton 回答的那样,ECMAScript 5th Edition 中引入了一种用于此目的的新方法。 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()的检查,它将返回通过原型链继承的属性。它也不能解决 Internet Explorer 中著名的 DontEnum 错误,在该错误中,原型链上的不可枚举属性导致具有相同名称的本地声明属性继承其 DontEnum 属性。

实现Object.keys()将为您提供更强大的解决方案。

编辑:最近与Prototype的知名撰稿人kangax 进行了讨论,我根据此处的 Object.forIn()函数的代码对 DontEnum 错误实施了变通方法。

请注意,Firefox 4,Chrome 6,Safari 5,IE 9 和更高版本支持 Object.keys 和其他 ECMAScript 5 方法。

例如:

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/

Object.getOwnPropertyNames(obj)

除了Object.keys(obj)所示的属性外,此函数还显示了不可枚举的属性。

在 JS 中,每个属性都有一些属性,包括 boolean 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.getOwnPropertyNamesObject.keys 不会沿着原型链向上寻找base
  • for in

有关原型链的更多信息,请访问: https : //stackoverflow.com/a/23877420/895245

可以使用 jQuery 进行如下操作:

var objectKeys = $.map(object, function(value, key) {
  return key;
});

如果您只想获取元素而不是函数,那么此代码可以为您提供帮助

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 对象

即使在 IE8 中,这也适用于大多数浏览器,并且不需要任何类型的库。我是您的钥匙。

var myJSONObject =  {"ircEvent": "PRIVMSG", "method": "newURI", "regex": "^http://.*"}; 
var keys=[];
for (var i in myJSONObject ) { keys.push(i); }
alert(keys);

在支持 js 1.8 的浏览器下:

[i for(i in obj)]