for in 和 for of 的区别

for in

• for in 一般用于遍历对象，不建议使用 for in 遍历数组，
• 如果迭代的对象的变量值是null或者undefined，for in不执行循环体，建议在使用for in循环之前，先检查该对象的值是不是null 或者 undefined

for of

• for of 语句在可迭代对象(包括 Array、Map、Set、String、TypedArray、arguments对象等等)上创建一个迭代循环，调用自定义迭代钩子，并为每个不同属性的值执行语句

两者区别

1. for...in 循环：只能获得对象的键名，不能获得键值

    for...of 循环：允许遍历获得键值

var arr = [ A,B,C ]
for( let item in arr ){
    console.log(item);//每一项的索引值 0 1 2 
    console.log(arr[item]);//每一项的值 A B C
}


var arr = [ A,B,C ]
for( let item of arr ){
    console.log(item);//每一项的值  A B C
}

2. for..in 循环不仅遍历数组键名，还会遍历手动添加的其它键，甚至包括原型链上的键。for...of 则不会这样

let arr = [1,2,3]
arr.set = 'world'  //手动添加的键
Array.prototype.name = 'hello'  //原型链上的键


for( let item in arr ){
    console.log('item',item)
}

/*
    item 0
    item 1
    item 2
    item set
    item name
*/

3. forEach 循环无法中途跳出，break命令或return 命令都不能奏效

let arr = [1,2,3,5,9]
arr.forEach(item => {
    if(item % 2 === 0){
        return
    }
    console.log('item', item)
})

/*
    item 1
    item 2
    item 5
    item 9

*/

4. for...of 循环与 break 、continue 和 return 配合使用，跳出循环

for( let item of arr){
    if (item % 2 === 0){
        break
    }
    console.log( item )
}
// item 1 

总之，for..in 循环主要是为了循环对象而生，不适用于遍历数组

for..of循环可以用来遍历数组。类数组对象、字符串、Set、Map、Generator 对象