（for…in）和（for…of）语句之间有什么区别？

Question

我知道什么是“代号”...在循环中（它迭代键），但我听说过for...（它迭代值）。

我对感到困惑...的循环。

var arr = [3, 5, 7];
arr.foo = "hello";
    
for (var i in arr) {
  console.log(i); // logs "0", "1", "2", "foo"
}
    
for (var i of arr) {
  console.log(i); // logs "3", "5", "7"
  // it doesn't log "3", "5", "7", "hello"
}

我知道是...of迭代属性值。那么为什么它不记录“3”、“5”、“7”、“hello”而不记录“3”、“5”、“7”？

与用于...的不同...在循环中，该循环迭代每个键(“0”、“1”、“2”、“foo”)并迭代foo键，的...of不迭代foo属性的值，即“hello”。为什么会这样？

在这里，我控制台的...的循环。它应该记录“3”、“5”、“7”、“hello”,但它记录“3”、“5”、“7”。为什么？

示例链接

Answer 1

我在迭代器和生成器中找到了完整的答案（虽然是针对TypeScript，但对于JavaScript也是一样的）

for..of和for..in语句都迭代列表；不过，迭代的值是不同的，for..in返回被迭代对象的键列表，而for..of返回被迭代对象的数值属性的值列表。

这里有一个例子说明了这种区别：

let list = [4, 5, 6];

for (let i in list) {
   console.log(i); // "0", "1", "2",
}

for (let i of list) {
   console.log(i); // "4", "5", "6"
}

另一个区别是，for..in对任何对象进行操作；它用作检查该对象的属性的一种方法。而for..of则主要对可迭代对象的值感兴趣。像map和set这样的内置对象实现了允许访问存储值的symbol.iterator属性。

let pets = new Set(["Cat", "Dog", "Hamster"]);
pets["species"] = "mammals";

for (let pet in pets) {
   console.log(pet); // "species"
}

for (let pet of pets) {
    console.log(pet); // "Cat", "Dog", "Hamster"
}

Answer 2

forin循环对象的可枚举属性名。

forof（在ES6中是新的）确实使用了特定于对象的迭代器，并在其生成的值上循环。

在您的示例中，数组迭代器确实会产生数组中的所有值（忽略非索引属性）。