前言

日常开发中我们可能会用到for of方法去循环数组，那么for of的底层原理是什么呢？哪些数据能使用for of方法呢？本节我们就来学习一下。

Symbol.iterator

首先我们先了解一下迭代器。Symbol.interator（迭代器）可以给对象定义一个迭代器，该迭代器可以被for of利用去循环数组。Symbol.interator由一个生成器函数构成，我们可以简单创建一个迭代器：

   class Method {
  *[Symbol.iterator]() {
    yield 1;
    yield 2;
    yield 3;
  }
}
const inter = new Method()
console.log(...inter) // 1 2 3

注意上面我们使用扩展运算符去打印的，这是因为扩展运算符的原理也运用了迭代器，所以生成器函数中的值能够被读取出来。迭代器会默认出现在原型中，以下类型原型中会默认有迭代器：Array、String、Map、Set、TypeArray，注意Object是没有迭代器的，for of不能循环对象的原因就在于此。我们可以console.log(new Array()，在原型中就能找到迭代器：

for of

for of就是Symbol.iterator的语法糖，具体的实现原理就是通过Symbol.iterator返回迭代器对象，然后循环去调用next()方法。next用来调用生成器的值，该方法会返回一个对象，对象里面包含value与done两个属性，value表示循环的值，done是个布尔值，当为ture时表示迭代结束，所有元素循环完毕。下面我们可以简单写一下for of的实现：

function* fun() {
  yield 1;
  yield 2;
}
const m = fun()
console.log(m.next())
console.log(m.next())
console.log(m.next())

首先通过写一个迭代器，然后通过next方法去读取里面的值，next返回的对象就是上述我们讲解的对象。普通对象是没有迭代器的，如果我们想要用for of去循环对象，那么就可以在Object原型上用以上代码写出一个迭代器，这是一个面试题，感兴趣的同学可以自己试着写一下，跟上面的案例思路基本一样。

总结

以上就是迭代器的全部内容，如果我们在面试中被问到for of的底层原理，就能够游刃有余的答出来了，就是通过迭代器加上next方法的调用。