我知道什么是a。在循环中(它在键上迭代),但我听说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键,for…Of不会遍历foo属性的值,即“hello”。为什么会这样?

在此我为……的循环。它应该日志“3”,“5”,“7”,“你好”,但日志“3”,“5”,“7”。为什么?

例子链接


当前回答

这里有一个有用的助记符来记住for…in Loop和for…的循环。

索引的对象

为…in Loop =>迭代数组中的索引。

为…of Loop =>遍历对象的对象。

其他回答

for-in语句以任意顺序遍历对象的可枚举属性。

该循环将遍历对象本身的所有可枚举属性以及对象从其构造函数原型继承的属性

你可以把它理解为for in迭代并列出所有键。

var str = 'abc';
var arrForOf = [];
var arrForIn = [];

for(value of str){
  arrForOf.push(value);
}

for(value in str){
  arrForIn.push(value);
}

console.log(arrForOf); 
// ["a", "b", "c"]
console.log(arrForIn); 
// ["0", "1", "2", "formatUnicorn", "truncate", "splitOnLast", "contains"]

For of用于遍历可迭代对象,For in用于遍历对象属性

这里有一个要记住的小技巧:

For of不是针对对象的(而是针对可迭代对象的)

For in不是针对可迭代对象的,而是针对对象的

另一个技巧:

For in返回对象索引(键),而For of返回值

这两个循环之间的另一个区别,之前没有人提到过:

解构……In已弃用。用于……相反。

因此,如果我们想在循环中使用解构,为了获取每个数组元素的索引和值,我们应该使用for…使用Array方法条目():

for (const [idx, el] of arr.entries()) {
    console.log( idx + ': ' + el );
}

每个人都解释了为什么会出现这个问题,但是仍然很容易忘记它,然后挠头为什么会得到错误的结果。尤其是当你处理大量数据时,乍一看结果似乎还不错。

使用对象。你确保去所有属性的条目:

var arr = [3, 5, 7];
arr.foo = "hello";

for ( var [key, val] of Object.entries( arr ) ) {
   console.log( val );
}

/* Result:

3
5
7
hello

*/

//for in,迭代对象中的键和数组中的索引

 let obj={a:1, b:2}
    
    for( const key in obj)
      console.log(obj[key]); //would print 1 and 2
      console.log(key);      //would print a and b

 let arr = [10, 11, 12, 13];

  for (const item in arr) 
    console.log(item);   //would print 0 1 2 3

//for of,迭代数组或任何可迭代对象中的值

let arr = [10, 11, 12, 13];

for (const item of arr )
  console.log(item);  //would print 10  11  12  13