14 Iterator和for...of循环

时间:2021-02-16 21:15:00

Iterator和for...of循环

首先 Iterator 是一个接口.

标准是

function makeIterator(array) {
  var nextIndex = 0;
  return {
    next: function() {
      return nextIndex < array.length ?
        {value: array[nextIndex++], done: false} :
        {value: undefined, done: true};
    }
  };
}

每次调用 next 返回两个值.

value : 任意值

done : 布尔值. 当 done : true 表示结束.

大概就是这样.

为什么会有这个接口呢.

大概是为了统一一下遍历吧..

毕竟.. 各种遍历方式

for. for in, for each 等等.

光是这样 for of 接口还是不识别.

他需要调用 Symbol.iterator

ES6规定,默认的Iterator接口部署在数据结构的Symbol.iterator属性,或者说,一个数据结构只要具有Symbol.iterator属性,就可以认为是“可遍历的”(iterable)

10

}

}

}

}

var o = new a()

for(var key of o) { console.log(key) }

0

1

2

3

4

5

6

7

8

9

undefined

结果就是这样.

```

你可以让任何一个对象实现或者重载这个接口.

按照你想要的方式 for of 输出

包括 arr,set .. 之类的原生支持 iterator 接口的对象也是这样的

let arr = ['a', 'b', 'c'];
let iter = arrSymbol.iterator;
iter.next()
//Object {value: "a", done: false}

他主要就是这种用法.

有了它你可以遍历任何对象.

其他就是书中的一些细节.

类数组的 iterator

NodeList.prototype[Symbol.iterator] = Array.prototype[Symbol.iterator];
// 或者
NodeList.prototype[Symbol.iterator] = [][Symbol.iterator];

[...document.querySelectorAll('div')] // 可以执行了

对象

let iterable = {
  0: 'a',
  1: 'b',
  2: 'c',
  length: 3,
  [Symbol.iterator]: Array.prototype[Symbol.iterator]
};
for (let item of iterable) {
  console.log(item); // 'a', 'b', 'c'
}

一些使用场景

let set = new Set().add('a').add('b').add('c');

let [x,y] = set;
// x='a'; y='b'

let [first, ...rest] = set;
// 例一
var str = 'hello';
[...str] //  ['h','e','l','l','o']

// 例二
let arr = ['b', 'c'];
['a', ...arr, 'd']
// ['a', 'b', 'c', 'd']

Generator 下一张会讲 蛮好玩的

let generator = function* () {
  yield 1;
  yield* [2,3,4];
  yield 5;
};

var 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 }
var someString = "hi";
typeof someString[Symbol.iterator]
// "function"

var iterator = someString[Symbol.iterator]();

iterator.next()  // { value: "h", done: false }
iterator.next()  // { value: "i", done: false }
iterator.next()  // { value: undefined, done: true }

字符串使用 for of 会挨个挨个遍历。

Return 如果 for of 中途停止.

会调用 return 中的方法

function readLinesSync(file) {
  return {
    next() {
      if (file.isAtEndOfFile()) {
        file.close();
        return { done: true };
      }
    },
    return() {
      file.close();
      return { done: true };
    },
  };
}
for (let line of readLinesSync(fileName)) {
  console.log(x);
  break;
}