（基础）JavaScript迭代器[Symbol.iterator]

迭代器就是为实现对不同集合进行统一遍历操作的一种机制，只要给需要遍历的数据结构部署Iterator接口，通过调用该接口，或者使用消耗该接口的API实现遍历操作。

迭代器 （iterator），是确使用户可在容器对象（container，例如链表或数组）上遍访的对象，使用该接口无需关心对象的内部实现细节。

        其行为像数据库中的光标，迭代器最早出现在1974年设计的CLU编程语言中；

在各种编程语言的实现中，迭代器的实现方式各不相同，但是基本都有迭代器，比如Java、Python等；

        从迭代器的定义我们可以看出来，迭代器是帮助我们对某个数据结构进行遍历的对象。

在JavaScript中，迭代器也是一个具体的对象，这个对象需要符合迭代器协议（iterator protocol）：

        迭代器协议定义了产生一系列值（无论是有限还是无限个）的标准方式；

那么在js中这个标准就是一个特定的next方法；

next方法有如下的要求：

        一个无参数或者一个参数的函数，返回一个应当拥有以下两个属性的对象：

done（boolean）

        如果迭代器可以产生序列中的下一个值，则为 false。（这等价于没有指定 done 这个属性。）

如果迭代器已将序列迭代完毕，则为 true。这种情况下，value 是可选的，如果它依然存在，即为迭代结束之后的默认返回值。

value

        迭代器返回的任何 JavaScript 值。done 为 true 时可省略。

实现迭代器函数

// 生成迭代器方法
function createArrayIterator(arr) {
  let index = 0
  return {
    next: function() {
      if (index < arr.length) {
        return { done: false, value: arr[index++] }
      } else {
        return { done: true, value: undefined } 
      }
    }
  }
}

const names = ["111", "222", "333"]
const namesIterator = createArrayIterator(names)
console.log(namesIterator.next())    
console.log(namesIterator.next())
console.log(namesIterator.next())

// 打印
// { done: false, value: '111' }
// { done: false, value: '222' }
// { done: false, value: '333' }

创建一个教室类，遍历教室学生

没有迭代器的

// 案例: 创建一个教室类, 创建出来的对象都是可迭代对象
class Classroom {
  constructor( students) {
    this.students = students
  }
  entry(newStudent) {
    this.students.push(newStudent)
  }
}

const classroom = new Classroom( ["学生1", "学生2", "学生3", "学生4", "学生5"])
classroom.entry("lilei")

for (const stu of classroom) {
  console.log(stu)
}


//报错classroom不是可迭代的
//for (const stu of classroom) {
                  ^

//TypeError: classroom is not iterable

自定义迭代器，可以遍历教室学生

// 案例: 创建一个教室类, 创建出来的对象都是可迭代对象
class Classroom {
  constructor( students) {
    this.students = students
  }
  entry(newStudent) {
    this.students.push(newStudent)
  }
  // 实现迭代器
  [Symbol.iterator]() {
    let index = 0
    return {
      next: () => {
        if (index < this.students.length) {
          return { done: false, value: this.students[index++] }
        } else {
          return { done: true, value: undefined }
        }
      },
      return: () => {    //监听迭代器停止
        console.log("迭代器提前终止了~")
        return { done: true, value: undefined }
      }
    }
  }
}

const classroom = new Classroom( ["学生1", "学生2", "学生3", "学生4", "学生5"])
classroom.entry("lilei")

for (const stu of classroom) {
  console.log(stu)
  if (stu === "学生4") break
}

// 打印
  // 学生1
  // 学生2
  // 学生3
  // 学生4
  // 迭代器提前终止了~

可迭代对象应用场景

1. for of场景
2. 数组展开语法 （对象展开 ES9(ES2018)中新增的一个特性: 用的不是迭代器）

3. 解构语法  （对象结构 ES9(ES2018)中新增的一个特性: 用的不是迭代器）

数组是可迭代对象

const arr = [12,3,45,67,8]
for(let item of arr){
  console.log(item);
}
// 打印
// 12
// 3
// 45
// 67
// 8

对象不是可迭代对象

const obj = { name: "why", age: 18 }
for(let item of obj){
  console.log(item);
}

// 打印
// for(let item of obj){
//   ^
// TypeError: obj is not iterable

所以数组可以使用for...of ,对象不可以