ES6--Iterator和for...of循环

遍历器(Iterator)就是统一的接口机制,来处理所有不同的数据结构。
Iterator的作用有三个:一是为各种数据结构,提供一个统一的、简便的访问接口;二是使得数据结构的成员
能够按某种次序排列;三是ES6创造了一种新的遍历命令for…of循环,Iterator接口主要供for…of消费。

Iterator的遍历过程是这样的。

创建一个指针,指向当前数据结构的起始位置。也就是说,遍历器的返回值是一个指针对象。
第一次调用指针对象的next方法,可以将指针指向数据结构的第一个成员。
第二次调用指针对象的next方法,指针就指向数据结构的第二个成员。
调用指针对象的next方法,直到它指向数据结构的结束位置。
每一次调用next方法,都会返回当前成员的信息,具体来说,就是返回一个包含value和done两个属性的对象。其中,value属性是当前成员的值,done属性是一个布尔值,表示遍历是否结束。

function idMaker(){
    var index = 0;

    return {
       next: function(){
           return {value: index++, done: false};
       }
    }
}

var it = idMaker();

it.next().value // '0'
it.next().value // '1'
it.next().value // '2'

数据结构的默认Iterator接口
在ES6中,可迭代数据结构(比如数组)都必须实现一个名为Symbol.iterator的方法,该方法返回一个该结构
元素的迭代器。注意,Symbol.iterator是一个Symbol,Symbol是ES6新加入的原始值类型。

let arr = ['a', 'b', 'c'];
let iter = arr[Symbol.iterator]();

iter.next() // { value: 'a', done: false }
iter.next() // { value: 'b', done: false }
iter.next() // { value: 'c', done: false }
iter.next() // { value: undefined, done: true }

变量arr是一个数组,原生就具有遍历器接口,部署在arr的Symbol.iterator属性上面。所以,调用这个属性,就得
到遍历器。

调用默认Iterator接口的场合

解构赋值
对数组和Set结构进行解构赋值时,会默认调用iterator接口。

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

let [x,y] = set;
console.log([x,y])
// x='a'; y='b'

let [first, ...rest] = set;
console.log(first,rest)
// first='a'; rest=['b','c'];

扩展运算符
扩展运算符(…)也会调用默认的iterator接口。

// 例一
var str = 'hello';
[...str] //  ['h','e','l','l','o'] //将数组中的值于函数上的参数自动一一对应

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

其他场合
以下场合也会用到默认的iterator接口

yield*
Array.from()
Map(), Set(), WeakMap(), WeakSet()
Promise.all(), Promise.race()

原生具备Iterator接口的数据结构

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 }


 调用Symbol.iterator方法返回一个遍历器,在这个遍历器上可以调用next方法,实现对于字符串的遍历。
 可以覆盖原生的Symbol.iterator方法,达到修改遍历器行为的目的。
 var str = new String("hi");

[...str] // ["h", "i"]

str[Symbol.iterator] = function() {
  return {
    next: function() {
      if (this._first) {
        this._first = false;
        return { value: "bye", done: false };
      } else {
        return { done: true };
      }
    },
    _first: true
  };
};

[...str] // ["bye"]
str // "hi"

字符串str的Symbol.iterator方法被修改了,所以扩展运算符(...)返回的值变成了bye,而字符串本身还是hi。

Iterator接口与Generator函数

ar myIterable = {};

myIterable[Symbol.iterator] = function* () {
  yield 1; //每一步的返回值
  yield 2;
  yield 3;
};
[...myIterable] // [1, 2, 3]

// 或者采用下面的简洁写法

let obj = {
  * [Symbol.iterator]() {
    yield 'hello';
    yield 'world';
  }
};

for (let x of obj) {
  document.write(x);
}
// hello
// world

Symbol.iterator方法几乎不用部署任何代码,只要用yield命令给出每一步的返回值即可

遍历器的return(),throw()
遍历器返回的指针对象除了具有next方法,还可以具有return方法和throw方法。其中,next方法是必须部
署的,return方法和throw方法是否部署是可选的。

return方法的使用场合是,如果for…of循环提前退出(通常是因为出错,或者有break语句或continue语
句),就会调用return方法。如果一个对象在完成遍历前,需要清理或释放资源,就可以部署return方法。

throw方法主要是配合Generator函数使用,一般的遍历器用不到这个方法。

for…of循环
迭代器对象允许像 CLI IEnumerable 或者 Java Iterable 一样自定义迭代器。将for..in转换为自定义的基于迭
代器的形如for..of的迭代,不需要实现一个数组,支持像 LINQ 一样的惰性设计模式。

let fibonacci = {
  [Symbol.iterator]() {
    let pre = 0, cur = 1;
    return {
      next() {
        [pre, cur] = [cur, pre + cur];
        return { done: false, value: cur }
      }
    }
  }
}

 //自动调用,内部的:Symbol.iterator方法
for (var n of fibonacci) {
  // truncate the sequence at 1000
  if (n > 1000)
    break;
  document.write(n);
}
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值