Iterator和for...of循环

首先 Iterator 是一个接口.

标准是

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

每次调用 next 返回两个值.

value : 任意值

done : 布尔值. 当 done : true 表示结束.

大概就是这样.

为什么会有这个接口呢.

大概是为了统一一下遍历吧..

毕竟.. 各种遍历方式

for. for in, for each 等等.

光是这样 for of 接口还是不识别.

他需要调用 Symbol.iterator

ES6规定,默认的Iterator接口部署在数据结构的Symbol.iterator属性,或者说,一个数据结构只要具有Symbol.iterator属性,就可以认为是“可遍历的”(iterable)

10

}

}

}

}

var o = new a()

for(var key of o) { console.log(key) }

0

1

2

3

4

5

6

7

8

9

undefined

结果就是这样.

```

你可以让任何一个对象实现或者重载这个接口.

按照你想要的方式 for of 输出

包括 arr,set .. 之类的原生支持 iterator 接口的对象也是这样的

let arr = ['a', 'b', 'c'];
let iter = arrSymbol.iterator;
iter.next()
//Object {value: "a", done: false}

他主要就是这种用法.

有了它你可以遍历任何对象.

其他就是书中的一些细节.

类数组的 iterator

NodeList.prototype[Symbol.iterator] = Array.prototype[Symbol.iterator];
// 或者
NodeList.prototype[Symbol.iterator] = [][Symbol.iterator];

[...document.querySelectorAll('div')] // 可以执行了

对象

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

一些使用场景

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

let [x,y] = set;
// x='a'; y='b'

let [first, ...rest] = set;
// 例一
var str = 'hello';
[...str] //  ['h','e','l','l','o']

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

Generator 下一张会讲 蛮好玩的

let generator = function* () {
  yield 1;
  yield* [2,3,4];
  yield 5;
};

var iterator = generator();

iterator.next() // { value: 1, done: false }
iterator.next() // { value: 2, done: false }
iterator.next() // { value: 3, done: false }
iterator.next() // { value: 4, done: false }
iterator.next() // { value: 5, done: false }
iterator.next() // { value: undefined, done: true }
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 }

字符串使用 for of 会挨个挨个遍历。

Return 如果 for of 中途停止.

会调用 return 中的方法

function readLinesSync(file) {
  return {
    next() {
      if (file.isAtEndOfFile()) {
        file.close();
        return { done: true };
      }
    },
    return() {
      file.close();
      return { done: true };
    },
  };
}
for (let line of readLinesSync(fileName)) {
  console.log(x);
  break;
}

14 Iterator和for...of循环的更多相关文章

  1. 14.Iterator 和 for...of 循环

    Iterator 和 for...of 循环 Iterator 和 for...of 循环 Iterator(遍历器)的概念 JavaScript 原有的表示"集合"的数据结构,主 ...

  2. ES6的新特性(14)——Iterator 和 for...of 循环

    Iterator 和 for...of 循环 Iterator(遍历器)的概念 JavaScript 原有的表示“集合”的数据结构,主要是数组(Array)和对象(Object),ES6 又添加了Ma ...

  3. ES6 之 Set数据结构和Map数据结构 Iterator和for...of循环

    ECMAScript 6 入门 Set数据结构 基本用法 ES6提供了新的数据结构Set.它类似于数组,但是成员的值都是唯一的,没有重复的值. Set本身是一个构造函数,用来生成Set数据结构. va ...

  4. java中的Iterator与增强for循环的效率比较

    最近在优化代码时遇到了这个问题:Iterator与增强for循环到底哪个效率高?之前在学习的时候,好像记着老师说过遍历集合(如list)时,使用iterator好像正规一些,因为是专用的,但是运行效率 ...

  5. es6笔记(6) Iterator 和 for...of循环

    概要 js中的数组.对象,加上ES6中增加的Map.Set四种数据集合. Iterator提供了一种机制,为各种不同的数据结构提供统一的访问机制.任何数据结构只要部署Iterator接口,就可以完成遍 ...

  6. Iterator和for...of循环

    Iterator和for...of循环 Iterator(遍历器)的概念 数据结构的默认Iterator接口 调用Iterator接口的场合 字符串的Iterator接口 Iterator接口与Gen ...

  7. ES6(Iterator 和 for...of 循环)

    Iterator 和 for...of 循环 1.什么是 Iterator 接口 Iterator 接口功能:用一种相同办法的接口让不同的数据结构得到统一的读取命令的方式 2.Iterator的基本用 ...

  8. es6(14)--iterator for ...of循环

    //iterator for ...of循环 { let arr=['hello','world']; let map=arr[Symbol.iterator](); console.log(map. ...

  9. JavaSE Collections类 , Iterator迭代器 , 增强for循环

    Collections 它是集合的工具类,为集合体系扩展了一些其他的方法.类中都是静态的方法,可以使用类名直接调用. 可变参数 在JDK1.5之后,如果我们定义一个方法需要接受多个参数,并且多个参数类 ...

随机推荐

  1. ExtPB.Net:窗体应用技巧(2)在树形导航下打开弹出的win窗口

    ExtPB.Net的demo程序有个树形导航菜单,里面的菜单打开的窗口放在右边的TabStrip控件中.我们可以设计win通过导航打开,但有时我们希望以弹出窗口的形式打开它,但怎么办呢?现在可以这样修 ...

  2. Appfuse:第一张表维护

    1. 建立表userinfo 列名 描述 UserID 主键.自增 UserName 用户名 Pwd 密码 CreateDate 创建日期 2. 在src/main/resources目录下增加文件h ...

  3. ps如何裁剪掉图片的不规则区域

    按P,鼠标变成钢笔工具,点选住待清除区域,如下: 按ctrl+enter, 将点线变成选中区域: 按delete删除: ctrl+D取消选中区域 完成!

  4. 使用c/c++扩展python

    用python脚本写应用比较方便,但有时候由于种种原因需要扩展python(比如给程序提供python接口等). 之前一直想整理下,今天终于坐下来把这件事情给做了,这里记录下,也方便我以后查阅. 说明 ...

  5. Linux httpd源码编译安装

    # wget http://apache.fayea.com/httpd/httpd-2.2.31.tar.bz2 去官网下载源码包 # mv httpd-.tar.bz2 /usr/local/sr ...

  6. Python 字符串相加问题

    今天在用Python拼接字符串时碰到个问题,从数据库取出来的数据以及获取到的时间等数据拼成了一个字符串a,将字符串a与自定义的字符串b拼接时一直中断,无法继续执行,也没有报错,将数据库取出数据变成自定 ...

  7. webform开发基础

    ASP.NET WebForm C/S(Client/Server):客户端服务器 B/S(Browser/Server):浏览器服务器 C/S和B/S的区别: 首先必须强调的是C/S和B/S并没有本 ...

  8. mysql workbench如何把已有的数据库导出ER模型

    mysql workbench的特长是创建表结构的,然后在结构图中,圈圈点点,很容易就利用可视化方式把数据库建好,然后再导入到数据库服务器中,这种办法很效率.但是有时我们有一个需求,事先没有建表结构模 ...

  9. PAT 1046. 划拳(15)

    划拳是古老中国酒文化的一个有趣的组成部分.酒桌上两人划拳的方法为:每人口中喊出一个数字,同时用手比划出一个数字.如果谁比划出的数字正好等于两人喊出的数字之和,谁就赢了,输家罚一杯酒.两人同赢或两人同输 ...

  10. [LeetCode] Maximal Square 最大正方形

    Given a 2D binary matrix filled with 0's and 1's, find the largest square containing all 1's and ret ...