for in 和 for of 的区别

JavaScript 原有的`for...in`循环，只能获得对象的键名，不能直接获取键值。ES6 提供`for...of`循环，允许遍历获得键值。

 let arr = ['red', 'blue', 'black']
        for (let key in arr) {
            console.log(key);//0,1,2
        }
        for(let key of arr){
            console.log(key);//red,blue,black
        }

for in 还可以遍历原型链上的键名，for of不会

   let arr = ['red', 'blue', 'black'];
        arr.name = '张三';
        Array.prototype.age = '男'
        for (let key in arr) {
            console.log(key);//0,1,2,name,age
        }
        for(let key of arr){
            console.log(key);//red,blue,black
        }

 在普通对象中直接使用for of，由于普通对象没有部署原生的 iterator 接口，则会报错！！！

let obj = {
            name:'武陵人',
            age:18,
            like:'music'
        }
        for (let key in obj){
            console.log(key);//name,age,like
        }
        for (let key of obj){
            console.log(key);//报错
        }

而原生具备iterator接口的数据结构有以下：

• Array
• Set
• Map
• String
• TypedArray (类数组)
• arguments对象
• NodeList对象 (节点)

 有兴趣的小伙伴可以加我微信Leyman233，可以建个群一起交流前端，我也还是个菜鸟，希望能一起进步！！！