如何枚举JavaScript对象的属性？

Question

如何枚举JavaScript对象的属性？如何枚举JavaScript对象的属性？实际上，我想列出所有定义的变量及其值，但我已经了解到，定义变量实际上会创建窗口对象的一个属性。

Answer 1

很简单：

for(var propertyName in myObject) {
   // propertyName is what you want
   // you can get the value like this: myObject[propertyName]}

现在，您将不会以这种方式获得私有变量，因为它们是不可用的。

---

除非您使用hasOwnProperty()方法，您将获得继承的属性-但是，我不知道为什么熟悉面向对象编程的人会期望得到更少的东西！通常，提出这个问题的人会受到道格拉斯·克罗克福德关于这件事的警告，这仍然让我有点困惑。同样，继承是OO语言的一个正常部分，因此也是JavaScript的一部分，尽管它是典型的。

现在，尽管如此，hasOwnProperty() 是对于过滤很有用，但是我们不需要发出警告，好像在获得继承的属性时有危险。

如果有人在您最初编写对象时(通过它的原型)之后的某个时间点向您的对象添加属性/方法，则会出现这样的情况-虽然这可能会导致意外的行为，但我个人并不认为这完全是我的问题。只是意见问题。此外，如果我的设计方式是在构造对象的过程中使用原型，而又有迭代对象属性的代码，并且我想要所有继承的属性，那该怎么办？我不会用hasOwnProperty()。然后，比方说，后来有人添加了新的属性。如果事情在这一点上表现不好，那是我的错吗？我不这样认为。我认为这就是为什么jQuery，作为一个例子，指定了如何扩展它的工作方式(通过jQuery.extend和jQuery.fn.extend).

Answer 2

用for..in循环来枚举对象的属性，但要小心。枚举不仅会返回被枚举对象的属性，还会返回任何父对象的原型属性。

var myObject = {foo: 'bar'};for (var name in myObject) {
  alert(name);}// results in a single alert of 'foo'Object.prototype.baz = 'quux';for (var name in myObject) {
  alert(name);}// results in two alerts, one for 'foo' and one for 'baz'

若要避免在枚举中包括继承的属性，请选中hasOwnProperty():

for (var name in myObject) {
  if (myObject.hasOwnProperty(name)) {
    alert(name);
  }}

编辑：我不同意JasonBunting的说法，即我们不需要担心枚举继承的属性。那里是枚举您不期望的继承属性时存在危险，因为它会更改代码的行为。

这个问题在其他语言中是否存在并不重要；事实是，它是存在的，而且JavaScript特别容易受到攻击，因为对象原型的修改会影响子对象，即使修改是在实例化之后进行的。

这就是为什么JavaScript提供hasOwnProperty()，这就是为什么您应该使用它，以确保第三方代码(或任何其他可能修改原型的代码)不会破坏您的代码。除了添加几个额外字节的代码之外，使用hasOwnProperty().

Answer 3

已经多次提出的标准办法是：

for (var name in myObject) {
  alert(name);}

然而，InternetExplorer 6、7和8在JavaScript解释器中有一个bug，其效果是没有枚举某些键。如果运行此代码：

var obj = { toString: 12};for (var name in obj) {
  alert(name);}

在除IE之外的所有浏览器中，if将警告“12”。就会忽略这个钥匙。受影响的键值是：

• isPrototypeOf

• hasOwnProperty

• toLocaleString

• toString

• valueOf

要想在IE中真正安全，您必须使用以下内容：

for (var key in myObject) {
  alert(key);}var shadowedKeys = [
  "isPrototypeOf",
  "hasOwnProperty",
  "toLocaleString",
  "toString",
  "valueOf"];for (var i=0, a=shadowedKeys, l=a.length; i<l; i++) {
  if map.hasOwnProperty(a[i])) {
    alert(a[i]);
  }}

好消息是ECMAScript 5定义了Object.keys(myObject)函数，它将对象的键作为数组返回，一些浏览器(例如Safari 4)已经实现了它。

Answer 4

在现代浏览器(ECMAScript 5)中，您可以获得所有可枚举的属性：

Object.key(Obj)(检查链接以获取片段，以了解旧浏览器的向后兼容性)

或者获取不可枚举的属性：

Object.getOwnPropertyNames(Obj)

检查ECMAScript 5兼容性表

其他信息：什么是可枚举属性？