一尘不染

JavaScript循环:for…in与for

javascript

我在Javascript中遇到了奇怪的行为。我懂了

“对象不支持此属性或方法”

removeAttribute以下代码中的函数异常:

var buttons = controlDiv.getElementsByTagName("button");
for ( var button in buttons )
    button.removeAttribute('disabled');

当我使用以下代码更改代码时,问题消失了:

var buttons = controlDiv.getElementsByTagName("button");
for ( var i = 0; i < buttons.length; i++ )
    buttons[i].removeAttribute('disabled');

buttoninside的值是for...in多少?


阅读 437

收藏
2020-05-01

共1个答案

一尘不染

不要for..in用于数组迭代。

重要的是要了解,[]用于访问索引的Javascript数组的方括号语法()实际上是从Object… 继承的。

obj.prop === obj['prop']  // true

for..in结构不能像for..each/in其他语言(php,python等)中所看到的那样更传统。

Javascript for..in旨在迭代对象的属性。产生每个属性的密钥。结合使用此Object的方括号语法,您可以轻松访问所需的值。

var obj = {
    foo: "bar",
    fizz: "buzz",
    moo: "muck"
};

for ( var prop in obj ) {
    console.log(prop);      // foo / fizz / moo
    console.log(obj[prop]); // bar / buzz / muck
}

并且由于数组只是具有 顺序数字属性名称(索引)的对象,因此其for..in工作方式类似,因此产生数字索引的方式与生成上面的属性名称相同。

for..in结构的一个重要特征是,它将继续在原型链中寻找可枚举的属性。它还将迭代 继承的可枚举属性
。您有责任验证当前属性是否直接存在于本地对象上,而不是它所附加的原型是否存在于本地对象上hasOwnProperty()

for ( var prop in obj ) {
    if ( obj.hasOwnProperty(prop) ) {
        // prop is actually obj's property (not inherited)
    }
}

for..in在Array类型上使用结构的问题在于,无法保证生成属性的顺序…通常来说,这在处理数组时至关重要。

另一个问题是它通常比标准for实现慢。

底线

使用a for...in来迭代数组就像使用螺丝刀的the子来钉钉子…为什么不只用锤子(for)?

2020-05-01