【javascript】面试官：for of 可以遍历对象吗？

一.情景再现

今天开心的去面试…
面试官：for…of 可以遍历对象吗
我：不可以吧
面试官：但是我就是想用for…of遍历一个对象，有什么办法能够实现吗？
我：用for…in 不就行了…

二.for …of 原理

1. 要想回答面试官这个问题，我们首先得知道for…of 为是什么能够遍历数组，而不能遍历对象
   只有部署了iterator接口的数据才能使用for...of遍历
   具备Iterator 接口的数据结构有以下几个

• Array
• Map
• Set
• String
• 函数argument 对象
• NodeList对象

2. for…of内部是怎么实现的呢？
   Iterator接口要求所遍历的数据结构上需要有Symbol.iterator属性，该属性的值应该是一个函数，函数内部有一个netx()方法，next方法会返回一个具有value和done属性的对象，该对象记录了返回值的数据及是否遍历完成

三.实现

我们先给数组实现一个Iterator接口
思路：

1. 给对象添加一个属性，symbol.iterator
2. 属性值是一个函数，函数返回一个next方法
3. next 方法需要返回一个value和done 属性

 Object.prototype[Symbol.iterator]=function(){
  const keys=Object.keys(this)
  let index=0
  const len=keys.length
    return {
        next(){
             if(index<len){
                index++
                return {
                    value:keys[index-1],
                    done:false
                }
             }else{
                return {
                    value:undefined,
                    done:true 
                }
             }      
        }
    }
 }

for…of 遍历对象

const obj = {
  name: "jack",
  age: 18,
};
for (const key of obj) {
 console.log(key); //name age
}