博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
js-ES6学习笔记-Iterator和for-of循环
阅读量:6406 次
发布时间:2019-06-23

本文共 2038 字,大约阅读时间需要 6 分钟。

1、遍历器(Iterator)是一种接口,为各种不同的数据结构提供统一的访问机制。任何数据结构只要部署Iterator接口,就可以完成遍历操作(即依次处理该数据结构的所有成员)。

手写iterator

function iterator(arr){        let index=0;        return {            next:function(){                return index

 

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

3、在ES6中,有些数据结构原生具备Iterator接口(比如数组),即不用任何处理,就可以被for...of循环遍历,有些就不行(比如对象)。原因在于,这些数据结构原生部署了Symbol.iterator属性(详见下文),另外一些数据结构没有。凡是部署了Symbol.iterator属性的数据结构,就称为部署了遍历器接口。调用这个接口,就会返回一个遍历器对象。

4、在ES6中,有三类数据结构原生具备Iterator接口:数组、某些类似数组的对象、Set和Map结构。

const arr=[1,2,3];    const set=new Set(['a','b','c']);    const map=new Map([['a',1]]);    const itArr=arr[Symbol.iterator]();    const itSet=set[Symbol.iterator]();    const itMap=map[Symbol.iterator]();    console.log(itArr)    console.log(itSet)    console.log(itMap)

 

5、一个为对象添加Iterator接口的例子。

let obj = {  data: [ 'hello', 'world' ],  [Symbol.iterator]() {    const self = this;    let index = 0;    return {      next() {        if (index < self.data.length) {          return {            value: self.data[index++],            done: false          };        } else {          return { value: undefined, done: true };        }      }    };  }};

6、下面是类似数组的对象调用数组的Symbol.iterator方法的例子。

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'}

注意,普通对象部署数组的Symbol.iterator方法,并无效果。

7、有一些场合会默认调用Iterator接口(即Symbol.iterator方法),除了for...of循环,还有几个别的场合。

  • 解构赋值
  • 扩展运算符(...)
  • yield*_yield*后面跟的是一个可遍历的结构,它会调用该结构的遍历器接口。
  • 由于数组的遍历会调用遍历器接口,所以任何接受数组作为参数的场合,其实都调用

8、字符串是一个类似数组的对象,也原生具有Iterator接口。

9、遍历器对象除了具有next方法,还可以具有return方法和throw方法。如果你自己写遍历器对象生成函数,那么next方法是必须部署的,return方法和throw方法是否部署是可选的。

10、for-of循环

const ofArr=[1,2,3,4];for(let i of ofArr){   console.log(i)  }const m=new Map();m.set('a',1).set('b',2).set('c',3);for(let data of m){  console.log(data)}for(let [key,value] of m){  console.log(key,value)}

 

转载于:https://www.cnblogs.com/mien-smil/p/ES6-Itarator.html

你可能感兴趣的文章
Guava Finalizer
查看>>
SharePoint 2013 页面访问,Url中间多一段"_layouts/15/start.aspx#"
查看>>
精品欣赏:30个养眼的精美自然风光的网站设计《上篇》
查看>>
知方可补不足~row_number,rank,dense_rank,ntile排名函数的用法
查看>>
向大家介绍15个漂亮的Ubuntu GDM主题
查看>>
中国的程序员是世界上最好的程序员。他们不计报酬,没日没夜地工作。没有女朋友,没有节假日,可能几年后他们一无所有。他们仍在加班。...
查看>>
JavaScript:异步 setTimeout
查看>>
DIV+CSS圆角边框
查看>>
Mybatis的ResultMap的使用
查看>>
精选30道Java笔试题解答
查看>>
linux shell 流程控制(条件if,循环【for,while】,选择【case】语句实例 --转载
查看>>
IE回车的一个怪异行为
查看>>
Linux shell join命令详解
查看>>
SharePoint如何配置Ipad跳转等问题
查看>>
ASP.NET MVC 初体验
查看>>
js library
查看>>
mysql导出数据库数据及表结构
查看>>
C#设计模式——抽象工厂
查看>>
原创:vsphere概念深入系列四:Nic Teaming若干问题
查看>>
Encapsulating Data 数据封装
查看>>