for ... in循环,字符串数组输出索引

Question

当我写一些像这样的javascript:

var words = ['word1', 'word2', 'word3']

for (word in words) {
    console.log(word)
}

结果输出是相应单词的数字索引.我在Google上进行了一些搜索,但我找不到这种行为的确切原因.我猜这是完全预期的行为,但我想知道原因.

谢谢!

Answer 1

为什么没有人提供正确的答案？你永远不会用循环迭代数组for/in- 这只是为了迭代普通对象及其键,而不是迭代数组中的项.

你为这样的for循环迭代数组:

var words = ['word1', 'word2', 'word3'];

for (var i = 0, len = words.length; i < len; i++) {
    // here words[i] is the array element
}

或者,在现代浏览器中,您可以使用.forEach()数组的方法:

var words = ['word1', 'word2', 'word3'];

words.forEach(function(value, index, array) {
    // here value is the array element being iterated
});

有关详细信息,请参阅MDN.forEach().

ndp对这篇文章的引用显示了一些使用for/in数组可能出错的好例子.你有时可以使它工作,但它不是编写Javascript数组迭代的聪明方法.

或者,在更现代的时候,您可以使用for/of专门为迭代迭代而构建的ES6 构造(数组是可迭代的):

var words = ['word1', 'word2', 'word3'];

for (const w of words) {
    console.log(w);
}

或者,如果您同时需要值和索引,则可以执行以下操作:

var words = ['word1', 'word2', 'word3'];

for (const [index, w] of words.entries()) {
    console.log(index, ": ", w);
}

有几个优点for/of过.forEach().首先,你必须为你可以使用更多的回路控制break,continue,return以控制其循环流动.forEach()不给你.此外,回调函数没有额外的开销,因此在某些环境中,它可以更快.