Iterator遍历器

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

作用:

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

Iterator的遍历过程:

(1)创建一个指针对象,指向当前数据结构的起始位置。也就是说,遍历器对象本质上,就是一个指针对象。

(2)第一次调用指针对象的next方法,可以将指针指向数据结构的第一个成员。

(3)第二次调用指针对象的next方法,指针就指向数据结构的第二个成员。

(4)不断调用指针对象的next方法,直到它指向数据结构的结束位置。

var it = makeIterator(['a', 'b']);

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

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

可以覆盖原生的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"

for...of

for...of循环可以使用的范围包括数组、Set和Map结构、某些类似数组的对象(比如arguments对象、DOM NodeList对象)、后文的Generator对象,以及字符串。

ES6入门之Iterator和for...of的更多相关文章

  1. ES6入门十一:Generator生成器、async+await、Promisify

    生成器的基本使用 生成器 + Promise async+await Promise化之Promisify工具方法 一.生成器的基本使用 在介绍生成器的使用之前,可以简单理解生成器实质上生成的就是一个 ...

  2. ES6入门十:iterator迭代器

    迭代模式 ES6迭代器标准化接口 迭代循环 自定义迭代器 迭代器消耗 一.迭代模式 迭代模式中,通常有一个包含某种数据集合的对象.该数据可能存在一个复杂数据结构内部,而要提供一种简单的方法能够访问数据 ...

  3. ES6入门笔记

    ES6入门笔记 02 Let&Const.md 增加了块级作用域. 常量 避免了变量提升 03 变量的解构赋值.md var [a, b, c] = [1, 2, 3]; var [[a,d] ...

  4. es6入门6--数组拓展运算符,Array.from()基本用法

    本文只是作为ES6入门第九章学习笔记,在整理知识点的同时,会加入部分个人思考与解答,若想知道更详细的介绍,还请阅读阮一峰大神的ES6入门 一.拓展运算符 ES6中新增了拓展运算(...)三个点,它的作 ...

  5. es6入门7--Set Map数据结构

    本文作为ES6入门第十三章的学习整理笔记,可能会包含少部分个人的理解推测,若想阅读更详细的介绍,还请阅读原文ES6入门 一.set数据结构 1.set不接受重复值 ES6新增了Set构造函数用于创建s ...

  6. es6入门4--promise详解

    可以说每个前端开发者都无法避免解决异步问题,尤其是当处理了某个异步调用A后,又要紧接着处理其它逻辑,而最直观的做法就是通过回调函数(当然事件派发也可以)处理,比如: 请求A(function (请求响 ...

  7. es6入门3--箭头函数与形参等属性的拓展

    对函数拓展兴趣更大一点,优先看,前面字符串后面再说,那些API居多,会使用能记住部分就好. 一.函数参数可以使用默认值 1.默认值生效条件 在变量的解构赋值就提到了,函数参数可以使用默认值了.正常我们 ...

  8. Vue+koa2开发一款全栈小程序(1.课程介绍+2.ES6入门)

    1.课程介绍 1.课程概述 1.做什么? Vue+koa2开发一款全栈小程序 2.哪些功能? 个人中心.图书列表.图书详情.图书评论.个人评论列表 3.技术栈 小程序.Vue.js.koa2.koa- ...

  9. es6入门5--class类的基本用法

    在ES6之前,准确来说JavaScript语言并无类的概念,却有模拟类的做法.相比在类似java这类传统面向对象语言中通过类来生成实例,js则通过构造函数模拟类来生成实例. 这是因为在JS设计初期,作 ...

随机推荐

  1. NEC学习 ---- 布局 -两列, 右侧定宽,左侧自适应

    该篇必须引用初始化样式和功能性样式,样式在前篇 http://www.cnblogs.com/Zell-Dinch/p/4436054.html 中已经提及. 上篇中介绍了左侧定宽,右侧自适应的布局, ...

  2. Sphinx+MySQL5.1x+SphinxSE+mmseg

    一.不停止mysql的情况下安装SphinxSE 1.确定mysql版本,下载对应源码包 此处下载5.1.69的mysql源码包 #wget ftp://ftp.ntu.edu.tw/pub/MySQ ...

  3. Nginx平滑重启

    kill -HUP cat /usr/local/nginx/logs/nginx.pid`

  4. diy-pagination-javascript 分页

    <?php isset($_REQUEST['form_single_page_num']) && !empty($_REQUEST['form_single_page_num' ...

  5. .Net 2.0自带的Json序列化、反序列化方法

    public class JsonUtil    {        public static T DeserializeObject<T>(string json)        {   ...

  6. Groovy 在eclipse中的使用

    今天在写Groovy脚本的时候发现一个问题.如下图,element的elementIterator()方法不能智能显示,只能手动输入.而在eclipse中如果类a没有方法a,那么你是用"cl ...

  7. 【Java 基础篇】【第七课】组合

    我所理解的组合就是在一个类当中又包含了另一个类的对象. 这样的方式就是组合吧: 电池是一个类,有电量 手电筒需要电池 看代码吧: // 电池类 class Battery { // 充电 public ...

  8. Spring冲刺阶段二(1)

    我们首先是根据同学们的评价来找补自己的不足之处,其中同学们反应最多的是我们的界面不够好看,但是我觉得虽然不好看但算是比较简洁.其次是没有体现内网在其中发挥的作用,这点我们还没有实现. 根据这些不足之处 ...

  9. 递归函数与fibonacci

    1.递归函数 1.1来个例子 def f(n): if n == 1: return 1 return n * f(n-1) print(f(5)) 结果为:120 即5的阶乘 通过这个例子来看递归函 ...

  10. Linux系统产生随机数的3种方法

    Linux系统产生随机数的3种方法 方法一:生成8位随机数 [root@localhost ~]# echo "$RANDOM$(date +%N%t)" | md5sum | c ...