ES6-迭代器介绍

是一种接口，为各种不同数据结构提供统一的访问机制，任何数据只要部署了iterator接口（在JS中指的是：对象中的一个属性）均可完成遍历操作。

1、ES6创建了一种新的遍历命令for…of循环，iterator接口主要提供for…of消费

2、原生具备iterator接口的数据（可用for…of遍历）包括：

1、Array

// 声明一个数组

const xiyou=['唐僧','孙悟空','猪八戒','沙僧'];

    // 使用for of进行遍历

   for (const v of xiyou) {

   console.log(v);

   //结果：唐僧

孙悟空

猪八戒

沙僧

   }

   console.log(xiyou);

   //结果：(4) ['唐僧', '孙悟空', '猪八戒', '沙僧']

2、Arguements

3、Set

4、Map

5、String

6、TypedArray

7、NodeList

3、工作原理

1、创建一个指针对象，指向当前数据结构的起始位置

2、第一次调用对象的next方法，指针自动指向数据结构的第一个成员

3、随后不断调用next方法，指针持续后移，直至指向最后一个成员

4、每次调用next方法返回一个包含value和done属性的对象

   const xiyou=['唐僧','孙悟空','猪八戒','沙僧'];

   console.log('iterator', iterator)

   //结果：iterator Array Iterator {}

   // 原理演示

   let iterator=xiyouSymbol.iterator;

   // 调用对象的next方法

   console.log(iterator.next());

   console.log(iterator.next());

   console.log(iterator.next());

   console.log(iterator.next());

   console.log(iterator.next());

   //结果：{value: '唐僧', done: false}

{value: '孙悟空', done: false}

{value: '猪八戒', done: false}

{value: '沙僧', done: false}

{value: undefined, done: true}

注：需进行自定义遍历数据时，要想到迭代器

ES6-迭代器（iterator）应用

自定义遍历数据

   // 声明一个对象

   const clases = {

   name: "终极一班",

   stus: ["小明", "小丽", "小甜", "Sam"],

   Symbol.iterator {

   // 索引变量

   let index=0;

   return {

   next: ()=>{

   if (index<this.stus.length) {

   let result= {value:this.stus[index],done:false};

   // 下标自增

   index++;

   // 返回结果

   return result

   } else {

   return{value:undefined,done:true}

   }

   },

   };

   },

   };

   // 使用for of遍历对象

   for (let v of clases) {

   console.log(v);

   }

// 结果：小明小丽小甜 Sam

ES6-ES11（Day9）

ES6-迭代器介绍

ES6-迭代器（iterator）应用