javascript总for of和for in的区别？-PHP中文网问答

javascript总for of和for in的区别？

高洛峰 2017-04-11 12:15:05

[JavaScript讨论组]

820

都是遍历，那有什么区别呢、？

高洛峰

拥有18年软件开发和IT教学经验。曾任多家上市公司技术总监、架构师、项目经理、高级软件工程师等职务。网络人气名人讲师，...

全部回复(13)

PHP中文网2017-04-11 12:17:05 13楼

以下两个输出结果是相通的

for (var key in arr){
    console.log(arr[key]);
}

for (var value of arr){
    console.log(value);
}

赞 +0

添加回复

迷茫2017-04-11 12:17:05 12楼

简单说，for in是遍历键名，for of是遍历键值。
例如：

let arr = ["a","b"];
for (a in arr) {
    console.log(a);//1,2
}

for (a of arr) {
    console.log(a);//a,b
}

由于for of的这个特性，他还可以实现对iterator对象的遍历，而for in就是简单的遍历了。

赞 +0

添加回复

PHP中文网2017-04-11 12:17:05 11楼

个人理解。for in是循环遍历对象；for of语法和for in语法很像，但它的功能却丰富的多，它能循环很多东西。推荐使用for of

赞 +0

添加回复

ringa_lee2017-04-11 12:17:05 10楼

for-of是ES6引进的新语法，for-in循环是遍历对象的属性，for-of循环是遍历实现iterator接口的成员。可以参考阮一峰大神的es6入门里的Iterator和for...of循环。

赞 +0

添加回复

迷茫2017-04-11 12:17:05 9楼

参考MDN MDN关于for of的解释
for...of语句在可迭代对象(包括 Array, Map, Set, String, TypedArray，arguments 对象等等)上创建一个迭代循环，对每个不同属性的属性值,调用一个自定义的有执行语句的迭代挂钩.
也就是说，for of只可以循环可迭代对象的可迭代属性，不可迭代属性在循环中被忽略了。
并且给与了一个对比的例子

Object.prototype.objCustom = function () {}; 
Array.prototype.arrCustom = function () {};

let iterable = [3, 5, 7];
iterable.foo = "hello";

for (let i in iterable) {
  console.log(i); // logs 0, 1, 2, "foo", "arrCustom", "objCustom"
}

for (let i of iterable) {
  console.log(i); // logs 3, 5, 7
}

我们可以看到，对于array的不可迭代元属性objCustom、arrCustom和实例属性foo，在循环中都被忽略
这是for in迭代KEY，for of迭代value之外最大的区别

赞 +0

添加回复