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. 在C语言中利用PCRE实现正则表达式

    1. PCRE简介 2. 正则表达式定义 3. PCRE正则表达式的定义 4. PCRE的函数简介 5. 使用PCRE在C语言中实现正则表达式的解析 6. PCRE函数在C语言中的使用小例子 1. P ...

  2. 搞不清FastCgi与PHP-fpm之间是个什么样的关系?

    问 我在网上查fastcgi与php-fpm的关系,查了快一周了,基本看了个遍,真是众说纷纭,没一个权威性的定义. 网上有的说,fastcgi是一个协议,php-fpm实现了这个协议: 有的说,php ...

  3. Elixir - Hey, two great tastes that go great together!

    这是Elixir的作者 José Valim 参与的一次技术访谈,很有料,我们可以了解Elixir的一些设计初衷,目标等等. 原文在: http://rubyrogues.com/114-rr-eli ...

  4. Linux下Session丢失原因

    最近碰到一个问题,把代码迁移到linux系统下,重新搭建php环境,运行代码, 在登录页面时,不能访问后台,会返回到登录页面,对代码测试,没有报任何错误, 最后检查到是跳转时,session丢失的问题 ...

  5. C# 中Switch case 返回不止用break

    Switch(temp) { case "A": //跳出循环 break; case "B": //返回值 return var; case "C& ...

  6. jmeter解决不同线程组之间传递参数问题

    首先在第一个线程组里讲你需要保存的值放入到jmeter的某个属性中,属性名名字自己定义,如上图的token , props.put("token", token),第二个参数必须是 ...

  7. 记一次从邻居无线路由渗透到邻居PC

    起因:因为房东的网太垃圾 决定自己动手丰衣足食蹭邻居的网 结果发现一个信号超好的无线路由0x01踩点 无意中发现TP-LINK_28C0这个无线信号特别的好 看起来就肯定知道是隔壁邻居的 抓了一下包 ...

  8. 使用串口线真机调试Linux内核

    一.环境 ubuntu 14.04 一台有串口的PC(编号PC1,被调试机器) 另一台PC通过USB转串口线连接PC1(编号PC2,发起调试命令的机器) 二.串口线配置及测试 安装cutecom US ...

  9. webgl动画小测试

    // MultiPoint.js (c) 2012 matsuda // Vertex shader program var VSHADER_SOURCE = 'attribute vec4 a_Po ...

  10. React服务端渲染总结

    欢迎吐槽 : ) 本demo地址( 前端库React+mobx+ReactRouter ):https://github.com/Penggggg/react-ssr.本文为笔者自学总结,有错误的地方 ...