javascript - 在 JavaScript 中使用 for...of 语法获取循环计数器/索引

Question

Caution:

question still applies to for…of loops.> Don't use for…in to iterate over an Array, use it to iterate over the properties of an object. That said, this

---

我了解 JavaScript 中的基本 for...in 语法如下所示:

for (var obj in myArray) {
    // ...
}

但是我如何获得循环counter/index？

我知道我可能会做这样的事情:

var i = 0;
for (var obj in myArray) {
    alert(i)
    i++
}

甚至是老好人:

for (var i = 0; i < myArray.length; i++) {
    var obj = myArray[i]
    alert(i)
}

但我宁愿使用更简单的 for-in 循环。我认为它们看起来更好，更有意义。

有没有更简单或更优雅的方式？

---

在 Python 中很简单:

for i, obj in enumerate(myArray):
    print i

Answer 1

for...in 迭代属性名称，而不是值，这样做in an unspecified order (是的，即使在 ES6 之后)。你不应该用它来迭代数组。对于他们来说，有 ES5 的 forEach 方法将值和索引都传递给你给它的函数:

var myArray = [123, 15, 187, 32];

myArray.forEach(function (value, i) {
    console.log('%d: %s', i, value);
});

// Outputs:
// 0: 123
// 1: 15
// 2: 187
// 3: 32

或 ES6 的 Array.prototype.entries ，现在支持跨当前浏览器版本:

for (const [i, value] of myArray.entries()) {
    console.log('%d: %s', i, value);
}

对于一般的可迭代对象(您将使用 for...of 循环而不是 for...in)，但是没有内置任何内容:

function* enumerate(iterable) {
    let i = 0;

    for (const x of iterable) {
        yield [i, x];
        i++;
    }
}

for (const [i, obj] of enumerate(myArray)) {
    console.log(i, obj);
}

demo

如果您确实是指 for...in – 枚举属性 – 您将需要一个额外的计数器。 Object.keys(obj).forEach 可以工作，但它只包含 own 属性； for...in 包括原型(prototype)链上任意位置的可枚举属性。