Symbol.iterator 和 for of
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的更多相关文章
- Iterator遍历器 调用Symbol.Iterator属性,遍历器对象。
Iterator实现原理 创建一个指针对象,指向当前数据结构的起始位置.也就是说,遍历器对象本质上,就是一个指针对象. 第一次调用指针对象的next方法,可以将指针指向数据结构的第一个成员. 第二次调 ...
- Es6 Symbol.iterator
Symbol.iterator 为每一个对象定义了默认的迭代器.该迭代器可以被 for...of 循环结构使用. --描述 当需要迭代一个对象的时候(比如在 for...of 循环的开始时),它的 @ ...
- ECMA Script 6_symbol(symbol.iterator) 新接口_iterator接口
iterator 接口 只要部署了 iterator 接口 symbol(symbol.iterator), 则可以进行 for...of 遍历
- symbol,iterator,generator
1.symbol是在ES6中引入的一种基本数据类型,因为symbol是不重复.唯一的数据特性,symbol设计是被用来表示对象内部的私有属性的. symbol.for与symbol.keyfo ...
- 关于Symbol.iterator 学习笔记
1.可以部署在对象上的一个遍历器 2. 遍历器是一个函数,需要返回一个含有一个next 方法的对象 const likeArray = {0:'a', 1: 'b', 2: 'c',3: 'd'. l ...
- Symbol.iterator的理解
https://blog.csdn.net/margin_0px/article/details/82971545
- ES6(模板字符串,三点运算符,Symbol,iterator接口)
模板字符串 作用:简化字符串的拼接 模板字符串必须用``包含 变化的部分使用${xxx}包含 对象的简写方式 同名的属性可以省略不写 可以省略函数的function 箭头函数 箭头函数的特点 箭头函数 ...
- 用vue.js学习es6(六):Iterator和for...of循环
一.Iterator (遍历器)的概念: 遍历器(Iterator)就是这样一种机制.它是一种接口,为各种不同的数据结构提供统一的访问机制.任何数据结构只 要部署Iterator接口,就可以完成遍历操 ...
- 14 Iterator和for...of循环
Iterator和for...of循环 首先 Iterator 是一个接口. 标准是 function makeIterator(array) { var nextIndex = 0; return ...
随机推荐
- Chapter2——如何分析Android程序
前几天买了<Android软件安全与逆向分析>这本书,决定在这里记一些笔记. 第一章介绍了如何搭建环境,此处略去:第二章开始讲分析Android程序. 下面按顺序记录关键内容. ----- ...
- MongoDB 复制集节点增加移除及节点属性配置
复制集(replica Set)或者副本集是MongoDB的核心高可用特性之一,它基于主节点的oplog日志持续传送到辅助节点,并重放得以实现主从节点一致.再结合心跳机制,当感知到主节点不可访问或宕机 ...
- rsync(五)工作机制
当我们讨论rsync时,我们使用了一些特殊的术语来代表不同的进程以及它们在任务执行过程中所扮演的角色.人类为了更方便.更准确地交流,使用同一种语言是非常重要的:同样地,在特定的上下文环境中,使用固定的 ...
- 《Kubernetes权威指南第2版》学习(二)一个简单的例子
1: 安装VirtualBox, 并下载CentOS-7-x86_64-DVD-1708.iso, 安装centOS7,具体过程可以百度. 2:开启centOS的SSH, 步骤如下: (1) yum ...
- final/finalize/finally的区别
一.性质不同 (1)final为关键字: (2)finalize()为方法:---垃圾回收机制中的方法(GC) (3)finally为为区块标志,用于try语句中: 二.作用 (1)final为用于标 ...
- sublimelinter-php 错误代码提示
先安装 SublimeLinter 如同其他插件一样使用 Package Control 来安装. 按下 Ctrl+Shift+p 进入 Command Palette 输入install进入 Pac ...
- 读取关联数据(EF Core2.1.1)
对象-关系映射框架比如EF有三种 方式使用 模型中的导航属性来加载关联数据. 一..Lazy Loading.(关联数据在访问导航属性时被透明的加载,不需要特别的代码,自动的加载) 当一个实体第一次读 ...
- Flutter实战视频-移动电商-34.列表页_小BUG的修复
34.列表页_小BUG的修复 当高粱酒的子类没有数据返回的时候就会报错. 解决接口空数据报错的问题 没有数据的时候,给用户一个友好的提示, 我们没有数据的时候还要告诉用户,提示一下他没有数据,在我们的 ...
- springMVC拦截配置
1.web.xml文件配置 <!-- spring mvc --> <servlet> <servlet-name>DispatcherServlet</se ...
- Python及Pycharm安装详细教程
参考:http://blog.csdn.net/qq_29883591/article/details/52664478 首先我们来安装python 1.首先进入网站下载:点击打开链接(或自己输入网址 ...