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

本文实例讲述了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 请看 http://www.jb51.net/article/110048.htm,如果你不知道Set 请看 http://www.jb51.net/article/110052.htm 。

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

(0)

相关推荐

  • ES6新特性二:Iterator(遍历器)和for-of循环详解

    本文实例讲述了ES6新特性之Iterator(遍历器)和for-of循环.分享给大家供大家参考,具体如下: 1. 遍历数组 for-of工作原理:迭代器有一个next方法,for循环会不断调用这个iterator.next方法来获取下一个值,直到返回值中的 done属性为true的时候结束循环. ① 在ES6之前 var arr = [1,2,3,4,5,6]; arr.name = 'a'; for (var index = 0; index < arr.length; index++) {

  • ES6入门教程之Iterator与for...of循环详解

    本文主要介绍了关于ES6中Iterator与for...of循环的相关内容,分享出来供大家参考学习,需要的朋友们下面来一起看看详细的介绍: 一.Iterator(遍历器) 遍历器(Iterator)是一种协议,任何对象只要部署了这个协议,就可以完成遍历操作.在ES6中遍历操作特质for-.of循环. 它的作用主要有两个: 为遍历对象的属性提供统一的接口. 使对象的属性能够按次序排列. ES6的遍历器协议规定,部署了next方法的对象,就具备了遍历器功能.next方法必须返回一个包含value和d

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

    本文实例讲述了ES6中Iterator与for..of..遍历用法.分享给大家供大家参考,具体如下: Iterator与for..of..遍历 1.Iterator概念 遍历器(Iterator)是一种接口,为各种不同的数据结构提供统一的访问机制.JS中有些数据结构具备原生的Iterator接口.为了更好理解这个概念,我们也可以自己写一个Iterator. var it = simIteractor(['hi','ES5']); console.log(it.next()); //Object

  • ES6中Symbol、Set和Map用法详解

    本文实例讲述了ES6中Symbol.Set和Map用法.分享给大家供大家参考,具体如下: Symbol 1.Symbol 是 ES6 引入了一种新的原始数据类型,表示独一无二的值.它是 JavaScript 语言的第七种数据类型,前六种分别是:undefined.null.布尔值(Boolean).字符串(String).数值(Number).对象(Object): 2.Symbol 值通过Symbol函数生成,可以作为对象的属性名使用,保证不会与其他属性名产生冲突: let s = Symbo

  • es6中Promise 对象基本功能与用法实例分析

    本文实例讲述了es6中Promise 对象基本功能与用法.分享给大家供大家参考,具体如下: Promise 是异步编程的一种解决方案,解决--回调函数和事件 ES6 规定,Promise对象是一个构造函数,用来生成Promise实例. 下面代码创造了一个Promise实例. 基本用法 ES6 规定,Promise对象是一个构造函数,用来生成Promise实例. const promise = new Promise(function(resolve, reject) { //resolve (d

  • ES6 Promise对象的含义和基本用法分析

    本文实例讲述了ES6 Promise对象的含义和基本用法.分享给大家供大家参考,具体如下: 1.Promise的含义 Promise是异步编程的一种解决方案,比传统的解决方案(回调函数和事件)更合理更强大. 所谓Promise,简单说就是一个容器,里面保存着某个未来才会结束的事件 (通常是一个异步操作)的结果.从语法上说,Promise是一个对象,从它可以获取异步操作的消息. Promise对象有以下2个特点: 1.对象的状态不受外界影响.Promise对象代表一个异步操作,有三种状态:Pend

  • Python中类似于jquery的pyquery库用法分析

    本文实例讲述了Python中类似于jquery的pyquery库用法.分享给大家供大家参考,具体如下: pyquery:一个类似于jquery的Python库 pyquery可以使你在xml文档上做jquery查询,它的API尽可能地类似于jquery.pyquery使用lxml执行快速的xml和html操作. 这并非(至少目前还不是)一个生成javascript代码或者与javascript代码做交互的库.pyquery的作者只是由于非常喜欢jquery的API因而将其用python实现. 该

  • ES6中new Function()语法及应用实例分析

    本文实例讲述了ES6中new Function()语法及应用.分享给大家供大家参考,具体如下: 学习<ECMAScript6入门>中的模板字符串的案例中看见了new Function()创建函数的语法: let str = 'return ' + '`Hello ${name}!`'; let func = new Function('name', str); func('Jack') // "Hello Jack!" 上面的代码传入name参数和字符串函数体,字符串函数体

  • ThinkPHP中RBAC类的四种用法分析

    本文实例讲述了ThinkPHP中RBAC类的四种用法.分享给大家供大家参考.具体方法如下: 第一类:放在登陆控制器的登陆操作中 1.RBAC::authenticate(); 用于在用户表中查找表单提交的用户名的数据,实质上就是一条用户表查寻语句: 复制代码 代码如下: return M(modle)->where(array)->find(); 这个操作有两个参数 a.array()数组的写法及作用和表查寻数组一样: 复制代码 代码如下: array('字段'=>'值','字段'=&g

  • php中ob_flush函数和flush函数用法分析

    本文实例分析了php中ob_flush函数和flush函数用法.分享给大家供大家参考.具体如下: ob_flush()函数: 取出PHP buffering中的数据,放入server buffering flush()函数: 取出Server buffering的数据,放入browser buffering 例如代码: <?php echo str_repeat('m0sh1' ,1000); for($i=0;$i<4;$i++) { echo $i.'<br />'; ob_f

  • javascript中parseInt()函数的定义和用法分析

    本文实例讲述了javascript中parseInt()函数的定义和用法.分享给大家供大家参考.具体分析如下: 此函数可以解析一个字符串,并返回一个整数. 语法结构: 复制代码 代码如下: parseInt(string, type) 参数列表: 参数 描述 string 必需.要被解析的字符串. type 可选.表示要解析的数字的基数,通俗的说就是数字的进制,比如二进制.八进制或者十六进制.该值介于2 ~ 36之间. 详细说明: 一.指定type参数: 指定type参数后,函数就会按照指定的t

  • php中get_meta_tags()、CURL与user-agent用法分析

    本文实例分析了php中get_meta_tags().CURL与user-agent用法.分享给大家供大家参考.具体分析如下: get_meta_tags()函数用于抓取网页中<meta name="A" content="1"><meta name="B" content="2">形式的标签,并装入一维数组,name为元素下标,content为元素值,上例中的标签可以获得数组:array('A'=&g

随机推荐