Symbol.iterator 和 for of 是es6的新特性 可以为对象设置 自己的迭代器

首先介绍我们的for of

var arr = [1,2,3,8,33]
for (var i of arr){
console.log(i)
}
1
2
3
8
33
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9

就是这么简单 
这里呢其实访问了 arr的迭代器调用next的方法的返回值中的value属性 (不知道我在说什么?继续往下看)

然后就是 Symbol.iterator

    var arr = [4,5,6,7,8];
var v = arr[Symbol.iterator]();
console.log( v.next() );
console.log( v.next() );
console.log( v.next() );
console.log( v.next() );
console.log( v.next() );
console.log( v.next() );
console.log( v.next() );
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9

echo

Object {value: 4, done: false}
Object {value: 5, done: false}
Object {value: 6, done: false}
Object {value: 7, done: false}
Object {value: 8, done: false} //注意这次的done 是 false
Object {value: undefined, done: true}
Object {value: undefined, done: true} //完成以后再次执行也是true
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7

然而object 是不支持迭代器的,于是我们DIY一个:)

    var obj ={
name:1,
age:13,
home:"xxxx"
}
Object.defineProperty(obj,Symbol.iterator,{
enumerable:false, //是否可枚举
writerable:false, //是否可写
configurable:true, //是否删除
value:function(){
var that = this;
var nowindex = 0;
var key = Object.keys(that); return {
next:function(){
var h = {
value:that[key[nowindex]],
done:(nowindex+1 >key.length )
}
nowindex++;
return h
}
}
}
}) var i = obj[Symbol.iterator](); console.log( i.next() ); // {value: 1, done: false}
console.log( i.next() ); // {value: 13, done: false}
console.log( i.next() ); // {value: "xxxx", done: false}
console.log( i.next() ); // {value: undefined, done: true}
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19
  • 20
  • 21
  • 22
  • 23
  • 24
  • 25
  • 26
  • 27
  • 28
  • 29
  • 30
  • 31
  • 32
  • 33

done!

等等 i.next()重复了好多次,这样写也太sb了:( 我好像想到了刚刚学的 for of 让我们来试试

    for (var y of obj){
console.log(y)
}
echo
1
13
xxxx
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8

这样就漂亮多了

Symbol.iterator 和 for of的更多相关文章

  1. Iterator遍历器 调用Symbol.Iterator属性,遍历器对象。

    Iterator实现原理 创建一个指针对象,指向当前数据结构的起始位置.也就是说,遍历器对象本质上,就是一个指针对象. 第一次调用指针对象的next方法,可以将指针指向数据结构的第一个成员. 第二次调 ...

  2. Es6 Symbol.iterator

    Symbol.iterator 为每一个对象定义了默认的迭代器.该迭代器可以被 for...of 循环结构使用. --描述 当需要迭代一个对象的时候(比如在 for...of 循环的开始时),它的 @ ...

  3. ECMA Script 6_symbol(symbol.iterator) 新接口_iterator接口

    iterator 接口 只要部署了 iterator 接口 symbol(symbol.iterator), 则可以进行 for...of  遍历

  4. symbol,iterator,generator

    1.symbol是在ES6中引入的一种基本数据类型,因为symbol是不重复.唯一的数据特性,symbol设计是被用来表示对象内部的私有属性的.     symbol.for与symbol.keyfo ...

  5. 关于Symbol.iterator 学习笔记

    1.可以部署在对象上的一个遍历器 2. 遍历器是一个函数,需要返回一个含有一个next 方法的对象 const likeArray = {0:'a', 1: 'b', 2: 'c',3: 'd'. l ...

  6. Symbol.iterator的理解

    https://blog.csdn.net/margin_0px/article/details/82971545

  7. ES6(模板字符串,三点运算符,Symbol,iterator接口)

    模板字符串 作用:简化字符串的拼接 模板字符串必须用``包含 变化的部分使用${xxx}包含 对象的简写方式 同名的属性可以省略不写 可以省略函数的function 箭头函数 箭头函数的特点 箭头函数 ...

  8. 用vue.js学习es6(六):Iterator和for...of循环

    一.Iterator (遍历器)的概念: 遍历器(Iterator)就是这样一种机制.它是一种接口,为各种不同的数据结构提供统一的访问机制.任何数据结构只 要部署Iterator接口,就可以完成遍历操 ...

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

    Iterator和for...of循环 首先 Iterator 是一个接口. 标准是 function makeIterator(array) { var nextIndex = 0; return ...

随机推荐

  1. C++之函数适配器--绑定器bind原理图解

    转自:http://www.cnblogs.com/xusd-null/p/3698969.html#3081606 本文解释了bind 是如何工作的.为了清晰,图中的语法作了一些简化(例如,省略函数 ...

  2. 九、myeclipse开发背景保护色设置

    window->preferences->Editors->Text Editors->Background color 背景颜色向你推荐: 色调:85.饱和度:1 2 3.亮 ...

  3. Datawindow.net中实现让当前行选中,并且当前行以其他颜色显示

    如何在Datawindow.net中实现让当前行选中,并且当前行以其他颜色显示 使用Datawindow.net要选中一行是很容易的意见事情,有很多种办法可以实现,最简单的莫过于使用selectrow ...

  4. supervisor 启动 celery 及启动中的问题

    一.前言 本教程重点在于supervisor的配置过程,celery的安装配置请参考其他教程 二.安装supervisor 1.安装命令 pip install supervisor # superv ...

  5. Fitnesse 之 Script Table

    在表中每一行代表一个执行脚本. 第一行中的Script关键字表明表格类型,后面紧跟着类名(Fixture)和构造函数中的参数.在一个测试页中如果没有再指定其它Fixture,将一直沿用上一个Fixtu ...

  6. Beatcoder#39+#41+#42

    HDU5211 思路: 倒着更新每个数的约数,更新完要把自己加上,以及1的情况? //#include <bits/stdc++.h> #include<iostream> # ...

  7. HDU4247【瞎搞】

    题意: 给你4个小正方形的边长,让你求一个最小大正方形的边长以至于可以存这么四个正方形. 思路: 比划了一下...就是最大边+次大边,因为他们一定有交集. #include <cstdio> ...

  8. [Xcode 实际操作]八、网络与多线程-(22)使用GCD多线程技术异步下载图片

    目录:[Swift]Xcode实际操作 本文将演示如何使用使用GCD多线程技术异步下载图片. Grand Central Dispatch(GCD) 是 Apple 开发的一个多核编程的较新的解决方法 ...

  9. PHP保留小数的相关方法

    结合一下网上的例子 $num = 10.4567; //第一种:利用round()对浮点数进行四舍五入 但是这个如果没有两位小数也不会"两位精度" echo round($num, ...

  10. IDEA快捷的添加包名

    Intellij IDEA使用(十四)—— 在IDEA中创建包(package)的问题 2018年02月24日 17:24:49 _云卷云舒_ 阅读数:6264 标签: intellij idea 更 ...