10.ES6-for...in...和for...of...

for…in…和for…of…

一.for…of是ES6新引入的特性.修复了ES5引入的for…in的不足

1. 先定义一个数组:let aArray = ['a', 123, { a: '1', b: '2'}];

for...in循环

for(let index in aArray){
    console.log(aArray[index]);//a 123 {a: "1", b: "2"}
}

for...of循环

for(var value of aArray){
    console.log(value);//a 123 {a: "1", b: "2"}
}

结果一样,但是for...in循环出的是key(键),for...of循环出的是value

2. 假设我们往数组中添加一个属性aArray.hame = ‘hi’

for(let index in aArray){
    console.log(aArray[index]);//a 123 {a:'1', b: '2'} hi
}
for(var value of aArray){
    console.log(value);//a 123 {a:'1', b: '2'}
}

得出结论:作用于数组的for-in循环除了遍历数组元素之外,还会遍历自定义属性.

for...of循环不会循环对象的key,只会循环出数组的value,因此for...of不能循环遍历普通对象,对普通对象的遍历普遍推荐使用for...in.

参考文档

ES6官方文档