ES6新特性之Iterator

1：基本概念

Iterator 迭代器是一种接口，为不同的数据结构提供统一的访问机制，这个访问机制主要是遍历，我们知道，在数组、在对象、在类数组、在map、在set里面，都可以用for of或者扩展运算符来得到一个数组或者是遍历当前的数据结构，为什么能够遍历的原因就是因为存在这个Iterator 迭代器这个东西，所以我们可以用for of来提供一个统一的遍历，因此这个底层或者是Itrator它最初是为了for of而设计的。

为了给所有的数据结构有一个统一的遍历接口，统一的访问机制，因此就产生了迭代器。

迭代器的特点：

• 按某种次序排列数据结构
• 为for of提供一个遍历支持
• 为不同的数据结构提供统一的访问机制（目的）

遍历过程：要遍历一个对象，Iterator要新建一个指针，指向数据结构的起始位置；然后调用next()方法，返回如下对象：

    {
        /* 当前位置数据值 */
        value: 'value',
        /* 是否遍历完成标识 */
        done: false,
    }
    {
        value: undefined,
        done: true,
    }

默认部署在数据结构Symbol.iterator属性上：为了提供一个统一的访问，防止篡改。

    let array = ['a', 'b', 'c', 'd'];
    
    let Iterator = array[Symbol.iterator]();
    
    /*
    Iterator.next()
    { value: "a", done: false }
    Iterator.next()
    { value: "b", done: false }
    Iterator.next()
    { value: "c", done: false }
    Iterator.next()
    { value: "d", done: false }
    Iterator.next()
    { value: undefined, done: true }
    Iterator.next()
    { value: undefined, done: true }
    */

默认包含迭代器对象

• Array
• Map
• Set
• String
• arguments
• NodeList

2：应用场景

• for......of
• 结构赋值

    let set = new Set().add('aa').add('bb');
    let [a, b] = set;
  
    //
    a: 'aa'
    b: 'bb'
  

• 扩展运算符
• generator函数

    let generator = function* () {
      yield 1;
      yield 2;
      yield 3;
      yield 4;
      yield 5;
    };
  
    let iterator = generator();
  
    //
    iterator.next();
    { value: 1, done: false }
    iterator.next()
    { value: 2, done: false }
    iterator.next()
    { value: 3, done: false }
    iterator.next()
    { value: 4, done: false }
    iterator.next()
    { value: 5, done: false }
    iterator.next()
    { value: undefined, done: true }
    iterator.next()
    { value: undefined, done: true }
  

3：数组遍历

• 遍历器覆盖

    const array = ['a', 'b', 'c'];
    for(let s of array) {
      console.log(s);
    }
  
    //
    a
    b
    c
  
    const array = ['a', 'b', 'c'];
    const object = {};
    object[Symbol.iterator] = () => {
      return array[Symbol.iterator].call(array);
    }
    for(let s of object) {
      console.log(s);
    }
    //
    a
    b
    c
  

• 获取键值与键名

    const array = ['a', 'b', 'c'];
    // for  of 等到的是value
    for(let s of array) {
      console.log(s);
    }
    //
    a
    b
    c
  
    // for  in等到的是key
    for(let s in array) {
      console.log(s);
    }
    //
    0
    1
    2
  

转载于:https://my.oschina.net/u/4144971/blog/3097697