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

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

3、在ES6中,有些数据结构原生具备Iterator接口(比如数组),即不用任何处理,就可以被for...of循环遍历,有些就不行(比如对象)。

原因在于,这些数据结构原生部署了Symbol.iterator属性(详见下文),另外一些数据结构没有。凡是部署了Symbol.iterator属性的数据结构,就称为部署了遍历器接口。调用这个接口,就会返回一个遍历器对象。

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

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方法是否部署是可选的。

js es6 Iterator的更多相关文章

  1. js es6 map 与 原生对象区别

    区别 object和Map存储的都是键值对组合.但是: object的键的类型是 字符串: map的键的类型是 可以是任意类型: 另外注意,object获取键值使用Object.keys(返回数组): ...

  2. JS&ES6学习笔记(持续更新)

    ES6学习笔记(2019.7.29) 目录 ES6学习笔记(2019.7.29) let和const let let 基本用法 let 不存在变量提升 暂时性死区 不允许重复声明 块级作用域 级作用域 ...

  3. js ES6 多行字符串 连接字符串

    1. 以前,js多行字符串用\n写起来比较费事,所以最新的ES6标准新增了一种多行字符串的表示方法,用` ... `表示: 旧版写法 alert("你好,\n 我叫\n Olive" ...

  4. Gist - ES6 Iterator

    Introduction Iterator is one of the most common design modes in daily development. Let's explore the ...

  5. js ES6 Set和Map数据结构详解

    这篇文章主要介绍了ES6学习笔记之Set和Map数据结构,结合实例形式详细分析了ECMAScript中基本数据结构Set和Map的常用属性与方法的功能.用法及相关注意事项,需要的朋友可以参考下   本 ...

  6. ES6—— iterator和for-of循环

    Iterator 遍历器的作用:为各种数据结构,提供一个同意的,简便的访问接口.是的数据结构的成员能够按某种次序排列.ES6 新增了遍历命令 for...of 循环,Iterator接口主要供 for ...

  7. es6 -- Iterator 和 for...of 循环

    1:Iterator(遍历器)的概念 JavaScript 原有的表示“集合”的数据结构,主要是数组(Array)和对象(Object),ES6 又添加了Map和Set.这样就有了四种数据集合,用户还 ...

  8. es6 Iterator和for...of循环

    javascript表示集合的数据结构有 es5: array object es6: map set, 一共4种数据集合 需要一种统一的接口机制来处理所有不同的数据结构 遍历器就是这样一种机制,它是 ...

  9. 2019.7月-前端面试总结(H5+C3+JS+ES6+Vue+浏览器)

    第二次面试 HTML HTML5中的新标签,举例一下 canvas绘画,本地离线存储localStorage,sessionStorage,video和audio元素,语义化元素,表单类型(date, ...

  10. JS ES6

    变量 let 块级作用域内有效 不能重复声明 不会预处理,不存在提升 var btns = document.getElementsByTagName('button'); for (let i = ...

随机推荐

  1. liunx 安装 python 虚拟环境, 各种方法,

    liunx 安装 python 虚拟环境,主要是要解决工作中需要用到python3.6,但是系统的2.7又不能动,安装系统组件时避免造成冲突.低版本的python安装django  uwsgi 等都用 ...

  2. obs 录制教程 手机录屏用 向日葵 手机投屏 能用有线用有线的连接

    obs 录制教程 手机录屏用 向日葵 手机投屏 稍微有点卡 华为手机有个投屏 笔记本不支持这个 miracast 淘宝有卖 投屏设备的,搜 miracast 100多米 免费的就用向日葵就得了. 最新 ...

  3. Android匿名共享内存(Anonymous Shared Memory) --- 瞎折腾记录 (驱动程序篇)

    PS:要转载请注明出处,本人版权所有. PS: 这个只是基于<我自己>的理解, 如果和你的原则及想法相冲突,请谅解,勿喷. 前置说明   本文作为本人csdn blog的主站的备份.(Bl ...

  4. 元宇宙解决方案——云端GPU在元宇宙中的作用

    GPU算力可以说是我们现在信息化时代的基础设施,在某种程度上说我们已经进入了算力时代,手机.电脑.车载等算力已经渗透到各行各业了. 当然算力对元宇宙也很重要,尤其是在可视化方面,元宇宙需要很逼真的渲染 ...

  5. 3DCAT亮相糖酒会,为元宇宙展会提供实时云渲染支持

    4月12日,第108届全国糖酒商品交易会(下文简称"糖酒会")在成都正式开幕,吸引了众多酒类企业和行业人士的参与. 图片源自新华社 本次糖酒会上,某展会采用了"双线&qu ...

  6. 喜报|3DCAT入选“灵境杯”深圳市最佳元宇宙案例!

    2022年11月10日~11日,2022全球元宇宙大会深圳站胜利召开,在本次大会上重磅发布"灵境杯"全球元宇宙创新大赛成果,公布深圳最具潜力元宇宙入选企业. 创新大赛结合" ...

  7. drf(视图组件)

    一. 前言 Django REST framwork 提供的视图的主要作用 1. 控制序列化器的执行(检验.保存.转换数据) 2. 控制数据库查询的执行 二. 两个视图基类 两个视图基类: APIVi ...

  8. axios中设置了response:blol后,如何处理json对象

    axios中文件下载 上传文件后台校验,若失败则下载文件 let loading = this.$common.loading("正在上传"); let form = new Fo ...

  9. 《On Java 8》笔记

    第一章 对象的概念 复用 组合和聚合 组合(Composition)经常用来表示"拥有"关系(has-a relationship).例如,"汽车拥有引擎" 聚 ...

  10. SSL加密以及http和https的区别是什么

    SSL加密是建立在非对称加密算法的基础上的.非对称加密算法会产生一对长字符串,称为密钥对(公钥.私钥).数据使用公钥进行加密后, 唯一只能使用私钥才能解开.安装了服务器证书的网站,其实是把私钥保存在服 ...