ES6 Iterator接口和for...of循环用法分析
本文实例讲述了ES6 Iterator接口和for...of循环用法。分享给大家供大家参考,具体如下:
<script> // 数组已经帮我们内置这个Iterator接口 let arr = ['hello','world']; let map = arr[Symbol.iterator](); // 数组直接调用iterator接口,返回一个对象map console.log(map.next()); // {value: "hello", done: false} done:循环没有下一步状态:true没有,false:有状态,循环并没有结束 console.log(map.next()); // {value: "world", done: false} console.log(map.next()); // {value: undefined, done: true} </script>
运行结果:
for...of循环,就是不断的调用Iterator接口。
object数据结构没有实现Iterator接口。
自定义实现object的Iterator接口
<script> let obj ={ start: [1,5,7], end:[8,4,3], [Symbol.iterator](){ let self = this; let index = 0; let arr = self.start.concat(self.end); let len = arr.length; return { next(){ if(index<len){ return{ value:arr[index++], done:false } }else{ return { value:arr[index++], done:true } } } } } } for(let key of obj){ // for...of 背后用的就是iterator接口 console.log(key); // 1 5 7 8 4 3 } </script>
运行结果:
<script> let arr = ['xixiaoxian','jamin']; for(let value of arr){ console.log(value); // xixiaoxian jamin } </script>
运行结果:
感兴趣的朋友可以使用在线HTML/CSS/JavaScript代码运行工具:http://tools.jb51.net/code/HtmlJsRun测试上述代码运行效果。
更多关于JavaScript相关内容可查看本站专题:《javascript面向对象入门教程》、《JavaScript错误与调试技巧总结》、《JavaScript数据结构与算法技巧总结》、《JavaScript遍历算法与技巧总结》及《JavaScript数学运算用法总结》
希望本文所述对大家JavaScript程序设计有所帮助。
相关文章
HTML使用js给input标签增加disabled属性的方法
最近项目上提出一个经常遇到的需求,点击新增时input可输入,点击编辑时input置灰,下面这篇文章主要给大家介绍了关于HTML使用js给input标签增加disabled属性的相关资料,需要的朋友可以参考下2024-06-06js中使用DOM复制(克隆)指定节点名数据到新的XML文件中的代码
使用DOM复制(克隆)指定节点名数据到新的XML文件中 ,用到三个类的相关知识点 : DOMDocument - DOMNodeList - DOMNode2011-07-07js触发asp.net的Button的Onclick事件应用
由于asp.net采用的是事件驱动模式,所以默认用户按回车并没有触发按钮的onclick事件。用户按回车也不是没有提交表单,通过httpwath可以看到,实际上页面表单是提交到了form下的action页面,只不过没有触发onclick事件而已,感兴趣的朋友可以了解下,或许对你有所帮助2013-02-02超漂亮的Bootstrap 富文本编辑器summernote
Summernote 是一个简单,灵活,所见即所得(WYSIWYG)的编辑器,基于 jQuery 和 Bootstrap 构建。对bootstrap 文本编辑器相关知识感兴趣的朋友一起学习吧2016-04-04
最新评论