获取对象键的数组

Question

我希望以jQuery或纯JavaScript的方式将JavaScript对象的键作为数组获取，有比下面这种方式更简洁的方法吗？

var foo = { 'alpha' : 'puffin', 'beta' : 'beagle' };
var keys = [];
for (var key in foo) {
    keys.push(key);
}

- Richard

---

除了添加if(foo.hasOwnProperty(key))之外，这就是我会做的。或者，使用$.map。 - gen_Eric

希望有一个Python的一行代码解决这个问题... - Richard

@unsynchronized 请不要将解决方案发布为评论。您的评论故意违反了明确和有意的页面结构设计。 - mickmackusa

Answer 1

使用 Object.keys：

var foo = {
  'alpha': 'puffin',
  'beta': 'beagle'
};

var keys = Object.keys(foo);
console.log(keys) // ['alpha', 'beta'] 
// (or maybe some other order, keys are unordered).

这是一个ES5特性。这意味着它可以在所有现代浏览器中工作，但在旧版浏览器中无法运行。

ES5-shim提供了Object.keys的实现，您可以使用

- Raynos

---

移动浏览器呢？ - Marwen Trabelsi

@SmartyTwiti：我不确定。我会假设在Chrome或Firefox中是这样的。 - gen_Eric

MDN也有上述提到的Polyfill，但指出IE7和可能的8中存在错误，然后引用了一个更短的Polyfill：http://tokenposts.blogspot.com.au/2012/04/javascript-objectkeys-browser.html。 - Campbeln

那么在 ES5 之前，人们是如何做到这一点的呢？ - Andrew S

在我意识到它是一个静态类方法之前，我尝试将键作为实例属性调用的次数...对API的理解- - MrMesees

Answer 2

您可以使用jQuery的$.map。

var foo = { 'alpha' : 'puffin', 'beta' : 'beagle' },
keys = $.map(foo, function(v, i){
  return i;
});

- gen_Eric

---

或者使用 each，如果你要对它们进行某些操作。$.each(foo, function(index, value){/* do something with index */}); - Chris

Answer 3

当然，Object.keys()是获取对象键的最佳方法。如果该方法在您的环境中不可用，可以使用类似于您示例中的代码进行替代（除非您需要考虑循环会遍历原型链上的所有属性，而不像Object.keys()只列举自身属性）。

然而，你的示例代码...

var foo = { 'alpha' : 'puffin', 'beta' : 'beagle' };
var keys = [];
for (var key in foo) {
    keys.push(key);
}

jsFiddle可以被修改。你可以在变量部分直接进行赋值。

var foo = { 'alpha' : 'puffin', 'beta' : 'beagle' };
var keys = [], i = 0;
for (keys[i++] in foo) {}

jsFiddle。

当然，这种行为与实际执行Object.keys()的结果不同(jsFiddle)。您可以简单地使用MDN文档中提供的shim。

- alex

---

我喜欢这个 var keys = [], i = 0; for (keys[i++] in foo) {} +1 - Jashwant

@ChrisStephens 无法保证顺序，即使键最终在有序数组中。 - alex

所有这些解决方案都需要一个 hasOwnProperty() 检查，是吗？ - unsynchronized

@TIMINeutron 没有理由不行 :) - alex

@Greg 我同意你的观点。 - alex

Answer 4

如果你在这里寻找一种将n层嵌套对象的键列出为平面数组的方法：

const getObjectKeys = (obj, prefix = '') => {
  return Object.entries(obj).reduce((collector, [key, val]) => {
    const newKeys = [ ...collector, prefix ? `${prefix}.${key}` : key ]
    if (Object.prototype.toString.call(val) === '[object Object]') {
      const newPrefix = prefix ? `${prefix}.${key}` : key
      const otherKeys = getObjectKeys(val, newPrefix)
      return [ ...newKeys, ...otherKeys ]
    }
    return newKeys
  }, [])
}

console.log(getObjectKeys({a: 1, b: 2, c: { d: 3, e: { f: 4 }}}))

- Cody Moniz

Answer 5

我不知道是否更简洁，但基于单行代码的要求，我受到启发将以下内容压缩成一行，虽然我不确定是否符合Python编程规范；）

var keys = (function(o){var ks=[]; for(var k in o) ks.push(k); return ks})(foo);

- Dexygen

---

或许应该是 var enumerableKeysOnThePrototypeChain ;) - alex

也许我们聪明到足以知道，如果对象是完全由我们管理创建的，而不是从其他地方导入的，那么就没必要担心 hasOwnProperty。 - Dexygen

不像 @alex 的第二个答案那么Pythonic (for (keys[i++] in foo) {})，因为你仍然需要执行 Array.push()（更不用说声明一个整个函数了）。Pythonic 的实现应该尽可能依赖于隐式的推导，并在失败时使用 lambda 表达式。 - cowbert

Answer 6

概要

要获取对象的所有键，可以使用 Object.keys() 方法。该方法接受一个对象作为参数，并返回一个包含所有键的数组。

示例：

const object = {
  a: 'string1',
  b: 42,
  c: 34
};

const keys = Object.keys(object)

console.log(keys);

console.log(keys.length) // we can easily access the total amount of properties the object has

在上面的示例中，我们将键数组存储在keys const中。我们可以通过检查keys数组的长度轻松访问对象上的属性数量。

获取值的方法为：Object.values() Object.keys()的补充函数是Object.values()。此功能将对象作为参数，并返回一个值数组。例如：

const object = {
  a: 'random',
  b: 22,
  c: true
};


console.log(Object.values(object));

- Willem van der Veen

Answer 7

2022年了，JavaScript仍然没有一种可靠的方法来处理哈希值？

以下代码会发出警告，但是可以正常工作：

Object.prototype.keys = function() { return Object.keys(this) }
console.log("Keys of an object: ", { a:1, b:2 }.keys() )

// Keys of an object:  Array [ "a", "b" ]
// WARN: Line 8:1:  Object prototype is read only, properties should not be added  no-extend-native

话虽如此，扩展内置对象是有争议的。

- Ondra Žižka

Answer 8

如果你决定使用Underscore.js，最好这样做。

var foo = { 'alpha' : 'puffin', 'beta' : 'beagle' };
var keys = [];
_.each( foo, function( val, key ) {
    keys.push(key);
});
console.log(keys);

- mohammad javad ahmadi

---

为什么？这是什么解释？ - Peter Mortensen