0

我的网络应用程序的主要 JavaScript 中有以下代码：

    // uniq for arrays
if (!Array.prototype.getUnique) {
    Array.prototype.getUnique = function () {
        var u = {}, a = [];
        for (var i = 0, l = this.length; i < l; ++i) {
            if (u.hasOwnProperty(this[i])) {
                continue;
            }
            a.push(this[i]);
            u[this[i]] = 1;
        }
        return a;
    }
}

这是一个简单uniq的 javascript 克隆，monkeypatched 到基本的 Array 类中。（不是在这里讨论猴子补丁，请在别处发火......）

getUnique()可以按预期工作，但是现在每当我使用循环遍历 Array 时，都会将for...in一个名为的附加索引getUnique传递给迭代器主体，并且当n查找此 false 时，getUnique代码就是值。（换句话说：for...in正在循环遍历数组，但附加 agetUnique作为最后一次迭代）

这里发生了什么？在这个函数的正上方还有另一个函数 monkeypatched 可以正常工作 ( indexOf()) 并且不会出现在迭代器中。以下是一些触发此问题的示例代码：

for (var r in result) {
    //tags = tags + result[r]["tags"].split(" ").join(", ")
    if (result[r]["tags"]) {
        var newtags = result[r]["tags"].split(" ");
        debug.log(newtags);
        for (var n in newtags) {
            debug.log("n is " + n);
            tags.push(newtags[n]);
        }
    }
}

此代码段的调试输出如下所示：

[14:22:26.090] [["camp", "furnitur", "wood"]]
[14:22:26.093] ["n is 0"]
[14:22:26.096] ["n is 1"]
[14:22:26.099] ["n is 2"]
[14:22:26.101] ["n is getUnique"]

这里发生了什么？重构 monkeypatch 并将其放入实用程序类很容易，但这对我来说是一个非常奇怪的边缘案例。我对这里发生的事情有一些想法，但这些只是猜测。谁能解释一下？

4

4 回答 4

1

for…in您不应该使用用于枚举对象属性的循环遍历数组。因此，例如，您不能保证索引的顺序，也不能保证——正如你所看到的——你只迭代数字索引。如果其他人以这种方式将属性添加到 Array 的原型中，您也将迭代该属性。请参阅https://developer.mozilla.org/en/JavaScript/Reference/Statements/for...in以获得完整的图片。

但是，在您的情况下，您可以执行以下操作：

for (var n in newtags) {
    if (newtags.hasOwnProperty(n)) {
        debug.log("n is " + n);
        tags.push(newtags[n]);
    }
}

这也可以防止迭代其他脚本添加到原型的属性。此外，您可以将您的函数定义为不可枚举（在支持 ES5 的浏览器中）：

Object.defineProperty(Array.prototype, "getUnique", {
    value: function () { /*.. your function ..*/}
})

请参阅：https ://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Object/defineProperty

于 2012-07-14T12:43:07.950 回答
1

常见的误解是 for...in 操作在 javascript 中是用来迭代数组的。这是错误的。它的用途是迭代对象的任何可枚举属性。在 javascript 中，一切都是对象（包括数组）。但是您可能会注意到，当您对数组执行 for...in 时，您不会得到像长度、切片等这样的值。这是因为这些不是对象的可枚举属性。

这个 SO question 有一些关于 for...in 用法的非常好的信息：为什么将“for...in”与数组迭代一起使用是个坏主意？

如果你想坚持使用 for...in，你可以像上面建议的那样做，并检查你的 for...in 中的 hasOwnProperty

for ( var v in myArray ) {
    if ( myArray.hasOwnProperty(v) ) {
        // Do Something
    } 
}

但是，我建议使用普通的旧无聊循环......

for ( var i = 0; i <= myArray.length - 1; i++ ) {
    // Do Something
}

无需深入细节，这不会影响您添加的方法，因为数组的“索引”根本不是真正的索引，而是名称与其相应索引匹配的属性：即 1、0、4 等。

它们感觉就像索引，因为在 javascript 中，如果该属性是数字，则您无法使用点符号访问该属性（即：myArray.0 将不起作用）。所以你做 myArray[0]，感觉就像一个数组。

于 2012-07-14T12:54:34.193 回答
1

这就是hasOwnProperty旨在解决的问题：它告诉您迭代到的名称是在对象本身上，还是从原型继承。

尝试这个：

for (var n in newtags) {
    if (newtags.hasOwnProperty(n)) {
        debug.log("n is " + n);
        tags.push(newtags[n]);
    }
}
于 2012-07-14T12:38:46.883 回答
1

不要for-in用于数值属性的迭代。

使用for循环：

 for (var i = 0; i < newtags.length; i++) {

该for-in声明几乎永远不是这项工作的正确工具，因为...

  • 它包括所有属性，包括非数字、超出范围和原型属性。

  • 它不保证枚举的顺序。

虽然您可以进行hasOwnProperty检查，但没有真正的好处，并且有一些缺点......

  • 它会减慢您的迭代速度

  • 它对枚举问题的顺序没有帮助

  • 有时您想要一个原型索引（很少见，但确实会发生）。使用hasOwnProperty使这成为不可能。

于 2012-07-14T12:39:41.580 回答