遍历Array可以采用下标循环,遍历MapSet就无法使用下标。为了统一集合类型,ES6标准引入了新的iterable类型,ArrayMapSet都属于iterable类型。

具有iterable类型的集合可以通过新的for ... of循环来遍历。

var a = ['A', 'B', 'C'];
var s = new Set(['A', 'B', 'C']);
var m = new Map([[1, 'x'], [2, 'y'], [3, 'z']]);
for (var x of a) { // 遍历Array
alert(x);
}
for (var x of s) { // 遍历Set
alert(x);
}
for (var x of m) { // 遍历Map
alert(x[0] + '=' + x[1]);
}

for ... in循环由于历史遗留问题,它遍历的实际上是对象的属性名称。一个Array数组实际上也是一个对象,它的每个元素的索引被视为一个属性。

当我们手动给Array对象添加了额外的属性后,for ... in循环将带来意想不到的意外效果:

var a = ['A', 'B', 'C'];
a.name = 'Hello';
for (var x in a) {
alert(x); // '0', '1', '2', 'name'
}

for ... in循环将把name包括在内,但Arraylength属性却不包括在内。
for ... of循环则完全修复了这些问题,它只循环集合本身的元素:
var a = ['A', 'B', 'C'];
a.name = 'Hello';
for (var x of a) {
alert(x); // 'A', 'B', 'C'
}

然而,更好的方式是直接使用iterable内置的forEach方法,它接收一个函数,每次迭代就自动回调该函数。以Array为例:
var a = ['A', 'B', 'C'];
a.forEach(function (element, index, array) {
// element: 指向当前元素的值
// index: 指向当前索引
// array: 指向Array对象本身
alert(element);
});
如果对某些参数不感兴趣,由于JavaScript的函数调用不要求参数必须一致,因此可以忽略它们。例如,只需要获得Arrayelement
var a = ['A', 'B', 'C'];
a.forEach(function (element) {
alert(element);
});
 

js iterable类型的更多相关文章

  1. JS 强制类型转化

    在Js中, 强制类型转化分为两种情况: 一种是引用类型转化基本类型, 如数组转化成数字:一种是两种不同基本类型之间的转化,如字符串转化为数字.你不能将基本类型转化成引用类型,比如,不可能把数字转化为数 ...

  2. js基本类型存放和对象存放的区别(对象遍历)

    js的基本类型,对象类型的应用在初学的时候,需要自己加以明确,明确了数据类型,在使用过程中才能正确使用变量.如下两个例子是摘自初学时的笔记,为大家提供参考. 1.对象可以存放属性和方法,js基本类型不 ...

  3. 关于js基本类型与引用类型(堆内存、栈内存的理解)

    js 基本类型与引用类型的区别 ECMAScirpt 变量有两种不同的数据类型:基本类型,引用类型.也有其他的叫法,比如原始类型和对象类型,拥有方法的类型和不能拥有方法的类型,还可以分为可变类型和不可 ...

  4. js变量类型详解

    <html> <title>js变量类型详解</title> <meta http-equiv="content-type" conten ...

  5. js基本类型 引用类型

    参考 https://segmentfault.com/a/1190000005794070 http://blog.csdn.net/yummy_go/article/details/5050468 ...

  6. js判断类型方法

    在JavaScript中,有5种基本数据类型和1种复杂数据类型,基本数据类型有:Undefined, Null,Boolean, Number和String:复杂数据类型是Object,Object中 ...

  7. js 基本类型与引用类型的区别

    1. 基本类型: string,number,boolean,null,undefined 2. 引用类型: Function,Array,Object 访问方式                   ...

  8. JS数组类型检测

    在强类型语言,数组类型检测是非常容易的事情(typeof就可以解决),而在弱语言JS数据类型就很容易混淆了. JS中常见的数据类型有:number.string.boolean.undefined.f ...

  9. js部分---类型,变量;

    <script type="text/javascript">1.注释:用“//或者/**/”2.数据类型: (1)整型 int (2)小数类型 单精度float 双精 ...

随机推荐

  1. DOS批量拷贝本地目录到远程主机(定时执行)

     echo !USER!  net use \\!REMOTE_ADDR!\IPC$ /u:!USER!  copy D:\batch\ip.bat \\!REMOTE_ADDR!\Admin$\ / ...

  2. Javascript中的this之我见

    来源:http://www.blogjava.net/baoyaer/articles/105864.html 在面向对象编程语言中,对于this关键字我们是非常熟悉的.比如C++.C#和Java等都 ...

  3. NFS 网络文件系统制作

    1. 构建根文件系统主要是建立相关的文件目录,以及各目录下相关的配置文件.管理工具等. 2. 首先创建文件目录. mkdir rootfs cd rootfs mkdir bin dev etc li ...

  4. Displacement Mapping

    [Displacement Mapping] Displacement Mapping(移位贴图). Normal maps的另一个应用是displacement mapping,在这个应用中,细节的 ...

  5. EF CodeFirst学习笔记003--如何创建表

    参考: http://www.cnblogs.com/Wayou/archive/2012/09/20/EF_CodeFirst.html webconfig中修改: <connectionSt ...

  6. SQLMAP自动注入(四):枚举

    --privileges 查询权限 -U 指定用户 -CU指定当前用户 --schema 查询所有的数据 --batch 批处理,自动选择默认选项 --exclude-sysdbs 排除系统库的查询 ...

  7. metasploit framework(十二):sql server扫描

    mssql_ping模块,如果1433端口开放的话,直接连接这个1433端口,如果没开放,就通过UDP的1434去查询TCP的sql server端口 run,就扫描出来了数据库的tcp端口 得到tc ...

  8. 一、Iterator 迭代器

    需求:如何不适用for循环,依次遍历出数组中每个元素? 设计原理: 代码清单: 接口类 public interface Iterator { boolean hasNext(); Object ne ...

  9. scrapy 琐碎的东西

    1.深度指定 DEPTH_LIMIT=1 2.常用命令 scrapy startproject name scrapy genspider name name.com scrapy crawl nam ...

  10. tab template

    <div class="box"> <div class="box-body"> <div class="nav-tab ...