ES6中Iterator与for..of..遍历用法分析


Posted in Javascript onMarch 31, 2017

本文实例讲述了ES6中Iterator与for..of..遍历用法。分享给大家供大家参考,具体如下:

Iterator与for..of..遍历

1.Iterator概念

遍历器(Iterator)是一种接口,为各种不同的数据结构提供统一的访问机制。JS中有些数据结构具备原生的Iterator接口。为了更好理解这个概念,我们也可以自己写一个Iterator。

var it = simIteractor(['hi','ES5']);
console.log(it.next()); //Object {value: "hi", done: false}
console.log(it.next()); //Object {value: "ES5", done: false}
console.log(it.next()); //Object {value: undefined, done: true}
function simIteractor(array){
    var nextIndex = 0;
    return{
      next: function(){
        return nextIndex < array.length ? {value: array[nextIndex++], done: false} : {value: undefined, done:true};
      }
    };
}

2.ES6中规定,默认的Iterator接口部署在数据结构的Symbol.iterator属性,或者说,一个数据结构只要具有Symbol.iterator属性就可以任务是可遍历的。在ES6中,有3类数据结构原生具备Iterator接口:数组、某些类似数组的对象、Set及Map。

3.提到可遍历,就要说说遍历的方法。

for...in... : for-in是为普通对象设计的,你可以遍历得到字符串类型的键,因此不适用于数组遍历

For...of... : for-of循环用来遍历数据—例如数组中的值。for-of循环也可以遍历其它的集合

for-of循环不仅支持数组,还支持大多数类数组对象,例如DOMNodeList。

for-of循环也支持字符串遍历,它将字符串视为一系列的Unicode字符来进行遍历:

or (var chr of "abc"){
  alert(chr); //依次弹出a,b,c
}

它同样支持Map和Set对象遍历。如果你不知道Map 请看 https://3water.com/article/110048.htm,如果你不知道Set 请看 https://3water.com/article/110052.htm 。

希望本文所述对大家ECMAScript程序设计有所帮助。

Javascript 相关文章推荐
javascript call方法使用说明
Jan 11 Javascript
如何实现chrome浏览器关闭页面时弹出“确定要离开此面吗?”
Mar 05 Javascript
详解WordPress开发中get_current_screen()函数的使用
Jan 11 Javascript
基于javascript实现文字无缝滚动效果
Mar 22 Javascript
vue.js学习之UI组件开发教程
Jul 03 Javascript
vue实现仿淘宝结账页面实例代码
Nov 08 Javascript
vue与vue-i18n结合实现后台数据的多语言切换方法
Mar 08 Javascript
解决vue的 v-for 循环中图片加载路径问题
Sep 03 Javascript
JS异步错误捕获的一些事小结
Apr 26 Javascript
JavaScript Array.flat()函数用法解析
Sep 02 Javascript
vue element el-transfer增加拖拽功能
Jan 15 Vue.js
JS前端监控采集用户行为的N种姿势
Jul 23 Javascript
node.js平台下的mysql数据库配置及连接
Mar 31 #Javascript
微信小程序 中wx.chooseAddress(OBJECT)实例详解
Mar 31 #Javascript
angular.JS实现网页禁用调试、复制和剪切
Mar 31 #Javascript
angular.js+node.js实现下载图片处理详解
Mar 31 #Javascript
JavaScript函数柯里化原理与用法分析
Mar 31 #Javascript
js实现一个猜数字游戏
Mar 31 #Javascript
微信小程序页面间通信的5种方式
Mar 31 #Javascript
You might like
PHP json_decode函数详细解析
2014/02/17 PHP
十大使用PHP框架的理由
2015/09/26 PHP
php使用Header函数,PHP_AUTH_PW和PHP_AUTH_USER做用户验证
2016/05/04 PHP
php fread函数使用方法总结
2019/05/28 PHP
经典的带阴影的可拖动的浮动层
2006/06/26 Javascript
CSS+JS构建的图片查看器
2006/07/22 Javascript
修改jQuery Validation里默认的验证方法
2012/02/14 Javascript
js简易namespace管理器 实例代码
2013/06/21 Javascript
浅谈JavaScript字符集
2014/05/22 Javascript
javascript作用域、作用域链(菜鸟必看)
2016/06/16 Javascript
AngularJS Bootstrap详细介绍及实例代码
2016/07/28 Javascript
利用 spin.js 生成等待效果(js 等待效果)
2017/06/25 Javascript
Laravel整合Bootstrap 4的完整方案(推荐)
2018/01/25 Javascript
详解React开发必不可少的eslint配置
2018/02/05 Javascript
简述vue状态管理模式之vuex
2018/08/29 Javascript
工作中常用到的ES6语法
2018/09/04 Javascript
Angular使用cli生成自定义文件、组件的方法
2018/09/04 Javascript
jQuery无冲突模式详解
2019/01/17 jQuery
JavaScript使用面向对象实现的拖拽功能详解
2019/06/12 Javascript
Vue-cli3项目引入Typescript的实现方法
2019/10/18 Javascript
如何利用JS将手机号中间四位变成*号
2020/09/29 Javascript
Swiper实现导航栏滚动效果
2020/10/16 Javascript
详解python的几种标准输出重定向方式
2016/08/15 Python
Python决策树和随机森林算法实例详解
2018/01/30 Python
Python简单实现的代理服务器端口映射功能示例
2018/04/08 Python
Django+RestFramework API接口及接口文档并返回json数据操作
2020/07/12 Python
详解python百行有效代码实现汉诺塔小游戏(简约版)
2020/10/30 Python
HTML5触摸事件演化tap事件介绍
2016/03/25 HTML / CSS
英国家用电器折扣网站:Electrical Discount UK
2018/09/17 全球购物
学生宿舍管理制度
2014/01/30 职场文书
119消防日活动总结
2014/08/29 职场文书
2014年村委会工作总结
2014/11/24 职场文书
党支部对转正的意见
2015/06/02 职场文书
SQL Server基本使用和简单的CRUD操作
2021/04/05 SQL Server
MySQL 数据表操作
2022/05/04 MySQL
Nginx跨域问题解析与解决
2022/08/05 Servers