高下相倾,前后相随——iterator 与 for ... of 循环
iterator 是es6新提供的一种遍历器。本质上是一个接口,为各种不同的数据结构,提供统一的访问机制。
数据只要部署了iterator接口,便是可遍历的数据,标志是具有Symbol.iterator属性。换句话说,我们只要给数据部署这个属性,就可以将数据变为可遍历的数据。具体表现是数据能否用for...of 遍历。
原生具有iterator接口的数据类型:set, map, nodeList,string, arguments。这些数据类型是可以用for...of 遍历的。
// 数组的Symbol.iterator
let arr = [1,2,4,65];
let iter = arr[Symbol.iterator]();
console.log(iter.next())
// 一个对象如果要具备可被for of 循环调用的Iterator接口,就必须在Symbol.iterator的属性上部署遍历器生成的方法
class RangeIterator {
constructor(start, stop){
this.value = start;
this.stop = stop;
}
[Symbol.iterator](){return this}
next () {
let value = this.value;
if (value < this.stop) {
this.value ++ ;
return {done: false, value: value}
} else {
return {done: true, value: undefined}
}
}
}
function range(start, stop) {
return new RangeIterator(start, stop)
}
for (let v of range(0, 3)) {
// console.log(v)
} // 遍历器实现指针结构的例子
function obj(value) {
this.value = value;
this.next = null;
}
obj.prototype[Symbol.iterator] = function () {
let iterator = {next: next};
let current = this;
function next() {
if (current) {
let value = current.value;
current = current.next;
return {done: false, value: value};
} else {
return {done: true}
}
}
return iterator;
}
let one = new obj(1);
let two = new obj(2);
let three = new obj(3);
one.text = two;
two.next = three;
for (let i of one) {
console.log(i)
}
// 对于类数组的对象(存在键值名和length属性),部署iterator接口,有一个简单的方法,就是Symbol.iterator 方法直接引用数组的Iterator接口
NodeList.prototype[Symbol.iterator] = Array.prototype[Symbol.iterator];
// 或者
NodeList.prototype[Symbol.iterator] = [][Symbol.iterator];
// 默认调用iterator的场合
/*
* 解构赋值
* 扩展运算符
* yield*
* 数组的遍历会调用遍历器的接口,所以任何接受数组为参数的场合,都会调用遍历器接口
*
* */
// 字符串的iterator 接口
let str = 'adf';
let str_iterator = str[Symbol.iterator]();
console.log(str_iterator.next(), str_iterator.next(), str_iterator.next())
高下相倾,前后相随——iterator 与 for ... of 循环的更多相关文章
- java中的Iterator与增强for循环的效率比较
最近在优化代码时遇到了这个问题:Iterator与增强for循环到底哪个效率高?之前在学习的时候,好像记着老师说过遍历集合(如list)时,使用iterator好像正规一些,因为是专用的,但是运行效率 ...
- 14 Iterator和for...of循环
Iterator和for...of循环 首先 Iterator 是一个接口. 标准是 function makeIterator(array) { var nextIndex = 0; return ...
- ES6 之 Set数据结构和Map数据结构 Iterator和for...of循环
ECMAScript 6 入门 Set数据结构 基本用法 ES6提供了新的数据结构Set.它类似于数组,但是成员的值都是唯一的,没有重复的值. Set本身是一个构造函数,用来生成Set数据结构. va ...
- es6笔记(6) Iterator 和 for...of循环
概要 js中的数组.对象,加上ES6中增加的Map.Set四种数据集合. Iterator提供了一种机制,为各种不同的数据结构提供统一的访问机制.任何数据结构只要部署Iterator接口,就可以完成遍 ...
- 14.Iterator 和 for...of 循环
Iterator 和 for...of 循环 Iterator 和 for...of 循环 Iterator(遍历器)的概念 JavaScript 原有的表示"集合"的数据结构,主 ...
- ES6的新特性(14)——Iterator 和 for...of 循环
Iterator 和 for...of 循环 Iterator(遍历器)的概念 JavaScript 原有的表示“集合”的数据结构,主要是数组(Array)和对象(Object),ES6 又添加了Ma ...
- Iterator和for...of循环
Iterator和for...of循环 Iterator(遍历器)的概念 数据结构的默认Iterator接口 调用Iterator接口的场合 字符串的Iterator接口 Iterator接口与Gen ...
- ES6(Iterator 和 for...of 循环)
Iterator 和 for...of 循环 1.什么是 Iterator 接口 Iterator 接口功能:用一种相同办法的接口让不同的数据结构得到统一的读取命令的方式 2.Iterator的基本用 ...
- 用vue.js学习es6(六):Iterator和for...of循环
一.Iterator (遍历器)的概念: 遍历器(Iterator)就是这样一种机制.它是一种接口,为各种不同的数据结构提供统一的访问机制.任何数据结构只 要部署Iterator接口,就可以完成遍历操 ...
随机推荐
- python全栈开发-Day7 文件处理
python全栈开发-Day7 文件处理 一 .文件操作 一 .介绍 计算机系统分为:计算机硬件,操作系统,应用程序三部分. 我们用python或其他语言编写的应用程序若想要把数据永久保存下来,必 ...
- spring cloud 专题二(spring cloud 入门搭建 之 微服务搭建和注册)
一.前言 本文为spring cloud 微服务框架专题的第二篇,主要讲解如何快速搭建微服务以及如何注册. 本文理论不多,主要是傻瓜式的环境搭建,适合新手快速入门. 为了更好的懂得原理,大家可以下载& ...
- Java基础_Java概述
Java_概述 特点: 平台的移植性 开源 面向对象 多线程 安全性 工作方式: 先编译再解释执行. 先通过Javac命令将Java源代码编译成字节码文件(bytecode,类文件,.class,中间 ...
- 【Python】 virtualenv虚拟环境建设和管理
[virtualenv] 用Python开发时面临的一个大问题就是每个项目需要的依赖包不一致.如果是包本身不一样倒还好,如果不同项目需要的是不同版本的包的话就会很麻烦.如果采用统一的系统Python环 ...
- java.lang.Object学习总结
- KVM之八:快照创建、恢复与删除
kvm虚拟机默认使用raw格式的镜像格式,性能最好,速度最快,它的缺点就是不支持一些新的功能,如支持镜像,zlib磁盘压缩,AES加密等.要使用镜像功能,磁盘格式必须为qcow2.下面开始kvm虚拟机 ...
- Linux下的 >, >>, <, ps, |, grep, /dev/null
1 要将命令行运行的结果保存到文件中,truncate模式下使用 >,append模式下使用 >> ls > ~/test.txt 2 要将文件中的内容作为标准输入,应使用 & ...
- Alpha冲刺No.5
一.站立式会议 在助教帮助下,优先解决404的问题,将demo移植到自己项目上. 进一步制作界面. 将已做好的内容,移植到手机做部分测试,能够在同一路由子网内登录数据库. 二.实际项目进展 已经解决了 ...
- 创建带缩进的XML
from xml.etree import ElementTree as ET from xml.dom import minidom root = ET.Element('}) son=ET.Sub ...
- Flask 学习 十六 部署
部署流程 manage.py 部署命令 每次安装升级只需运行deploy命令即可完成操作 @manager.command def deploy(): """执行部署任务 ...