我知道什么是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 of (ES6新增功能)使用特定于对象的迭代器并遍历由该迭代器生成的值。
在你的例子中，数组迭代器产生数组中的所有值(忽略非索引属性)。
当我第一次开始学习for in和of循环时，我也对我的输出感到困惑，但通过一些研究和理解，你可以像下面这样思考单个循环: 的
为…在循环中返回单个属性的索引，对属性的值没有影响，它循环并返回关于属性的信息，而不是关于属性的值。 如
Let profile = { 名字叫拿弗他利。 年龄:24岁 favCar:“野马”， 最喜欢的饮料:百利酒 ｝
上面的代码只是创建了一个名为profile的对象，我们将在两个示例中使用它，因此，当您在示例中看到profile对象时，不要感到困惑，只需知道它已被创建。
现在让我们用for…在下面的循环中
for(let myIndex in profile){
console.log(`The index of my object property is ${myIndex}`)
}
// Outputs :
The index of my object property is 0
The index of my object property is 1
The index of my object property is 2
The index of my object property is 3
现在输出的原因是，我们的配置文件对象中有四(4)个属性，我们都知道索引从0开始…N，我们得到了属性的下标0,1,2,3因为我们使用的是for. in循环。
for...of loop* can return either the property, value or both, Let's take a look at how. In javaScript, we can't loop through objects normally as we would on arrays, so, there are a few elements we can use to access either of our choices from an object. Object.keys(object-name-goes-here) >>> Returns the keys or properties of an object. Object.values(object-name-goes-here) >>> Returns the values of an object. Object.entries(object-name-goes-here) >>> Returns both the keys and values of an object.
下面是它们的用法示例，请注意Object.entries():
Step One: Convert the object to get either its key, value, or both.
Step Two: loop through.
// Getting the keys/property
Step One: let myKeys = ***Object.keys(profile)***
Step Two: for(let keys of myKeys){
console.log(`The key of my object property is ${keys}`)
}
// Getting the values of the property
Step One: let myValues = ***Object.values(profile)***
Step Two : for(let values of myValues){
console.log(`The value of my object property is ${values}`)
}
当使用object .entries()时，需要调用对象上的两个条目，即键和值。您可以通过条目中的任意一个调用两者。下面的例子。
Step One: Convert the object to entries, using ***Object.entries(object-name)***
Step Two: **Destructure** the ***entries object which carries the keys and values***
like so **[keys, values]**, by so doing, you have access to either or both content.
// Getting the keys/property
Step One: let myKeysEntry = ***Object.entries(profile)***
Step Two: for(let [keys, values] of myKeysEntry){
console.log(`The key of my object property is ${keys}`)
}
// Getting the values of the property
Step One: let myValuesEntry = ***Object.entries(profile)***
Step Two : for(let [keys, values] of myValuesEntry){
console.log(`The value of my object property is ${values}`)
}
// Getting both keys and values
Step One: let myBothEntry = ***Object.entries(profile)***
Step Two : for(let [keys, values] of myBothEntry){
console.log(`The keys of my object is ${keys} and its value
is ${values}`)
}
对不清楚的部分提出意见。
//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
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"]
简单来说，forIN遍历数组(索引)/对象(键)中的key， 而forOF则遍历数组(value)的值。
