ES6,数组遍历
ES6提供了entries(),keys(),values()方法返回数组的遍历器,对于遍历器(Iterator)可以使用for...of进行便利,也可是使用entries()返回的遍历器Iterator.next()方法进行遍历。
1.使用keys()遍历。
keys()返回的是数组元素索引号的遍历器。
const arr1 = ['a', 'b', 'c', 'd', 'e', 'f', 'g', 'h', 'i', 'j', 'k']
for (let index of arr1.keys()) {
console.log(index);
}
结果:
可以看到输出的都是每个数组元素的index。
0
1
2
3
4
5
6
7
8
9
10
2.使用values()遍历。
values()返回的是数组元素值的遍历器。
for (let val of arr1.values()) {
console.log(val);
}
结果:
a
b
c
d
e
f
g
h
i
j
k
3.使用entries()遍历。
配合解构使用,可以拿到元素的index和value。
for (let [index, val] of arr1.entries()) {
console.log(index, val);
}
结果:
0 'a'
1 'b'
2 'c'
3 'd'
4 'e'
5 'f'
6 'g'
7 'h'
8 'i'
9 'j'
10 'k'
4.使用Iterator.next()遍历。
基于entries()返回的遍历器,调用遍历器的next()的方法可以获取每一个元素的访问入口,该入口有一个done属性可以表明是否便利结束。通过入口可以拿到value属性,其就是元素的索引和值的数组。
let arrEntries=arr1.entries();
let entry=arrEntries.next();
while(!entry.done){
console.log(entry.value);
entry=arrEntries.next();
}
结果:
[ 0, 'a' ]
[ 1, 'b' ]
[ 2, 'c' ]
[ 3, 'd' ]
[ 4, 'e' ]
[ 5, 'f' ]
[ 6, 'g' ]
[ 7, 'h' ]
[ 8, 'i' ]
[ 9, 'j' ]
[ 10, 'k' ]
End
ES6,数组遍历的更多相关文章
- 关于 ES5 & ES6 数组遍历的方法
ES5 数组遍历方法 1.for 循环 , , , , ] ; i < arr.length; i++) { console.log(arr[i]) } 2.forEach , , , , ] ...
- ES6 数组遍历方法的实战用法总结(forEach,every,some,map,filter,reduce,reduceRight,indexOf,lastIndexOf)
目录 forEach every some map filter reduce && reduceRight indexOf lastIndexOf 前言 ES6原生语法中提供了非常多 ...
- JS几种数组遍历方式以及性能分析对比
前言 这一篇与上一篇 JS几种变量交换方式以及性能分析对比 属于同一个系列,本文继续分析JS中几种常用的数组遍历方式以及各自的性能对比 起由 在上一次分析了JS几种常用变量交换方式以及各自性能后,觉得 ...
- js数组遍历和对象遍历
针对js各种遍历作一个总结分析,从类型用处:分数组遍历和对象遍历:还有性能,优缺点等. JS数组遍历: 1,普通for循环,经常用的数组遍历 var arr = [1,2,0,3,9]; for ( ...
- ES6数组及数组方法
ES6数组可以支持下面的几种写法: (1)var [a,b,c] = [1,2,3]; (2)var [a,[[b],c]] = [1,[[2],3]]; (3)let [x,,y] = [1,2,3 ...
- 数组的复制及ES6数组的扩展
一.数组的复制 // alert([1,2,3]==[1,2,3]); let cc = [0,1,2]; let dd = cc; alert(dd==cc);//此时改变dd会影响cc ES5 只 ...
- js数组遍历方法总结
数组遍历方法 1.for循环 使用临时变量,将长度缓存起来,避免重复获取数组长度,当数组较大时优化效果才会比较明显. 1 2 3 for(j = 0,len=arr.length; j < le ...
- es6数组的扩展
数组扩展运算符 ...(三个点) const demoArr=[0,1,2,3,4] console.log(...demoArr) // 0 1 2 3 4 // 他把一个数组用逗号分隔了出来 // ...
- ES6 数组方法拓展
ES6 数组方法拓展 1.Array.from() Array.from方法用于将两类对象转为真正的数组:类似数组的对象(array-like object)和可遍历(iterable)的对象(包括E ...
- ES6数组相关
ES6数组新增的几个方法: 1. forEach() //forEach()遍历数组,无返回值,不改变原数组 var arr=[1,2,3,4] arr.forEach((item,index,arr ...
随机推荐
- thinkPHP中_initialize方法实例分析
子类的_initialize方法自动调用父类的_initialize方法. 而php的构造函数construct,如果要调用父类的方法,必须在子类构造函数显示调用parent::__construct ...
- linux下yum命令出现Loaded plugins: fastestmirror
yum install的时候提示:Loaded plugins: fastestmirror fastestmirror是yum的一个加速插件,这里是插件提示信息是插件不能用了. 不能用就先别用呗,禁 ...
- CentOS 7安装Oracle 11gR2以及设置自启动
一.环境准备 1.正确无误的CentOS 7系统环境 CentOS 7安装:http://www.cnblogs.com/VoiceOfDreams/p/8043958.html 2.正确的JDK环境 ...
- WEB前端大神之路之基础篇
CSS篇: 1.CSS权重: 不重复造轮子啦,直接传送门(CSS选择器的权重与优先规则) JavaScript篇: 1.this关键字: 它是一种引用(referent).指向的是当前上下文(cont ...
- 如何用Safari联调Hybrid APP
随着Hybrid APP的流行,对其调试变得必不可少.使用Xcode我们能看到的仅仅是WebView,要想进一步查看里面的a标签.button和其他元素,Xcode是心有余而力不足.但是不用担心,Sa ...
- linux unzip 解压后文件名乱码
在windows上zip的包,rz上传到linux下,发现出现乱码.记录下解决过程: 1.确定windows上的默认字符集 在Windows平台下,直接在命令行中,输入:chcp 在显示的结果中,会出 ...
- 2017-07-01(ifconfig ifdown ifup netstat )
ifconfig 可以查看IP地址与子网掩码 ifdown(禁用网卡) ifdown 网络设备名 ifdown eth0 ifup (启动网卡) ifup 网络设备名 ifup eth0 net ...
- RocketMQ-消费重试机制
介绍: RocketMQ的消息重试及时分为两种,一种是Producer端重试,一种是Consume端重试. 1.Producer端重试 : 1.1消息发没发成功,默认情况下是3次重试. 2.Consu ...
- js_4_函数
js的函数是怎么定义的? function 函数名(形参1,......) { 函数体: return 返回值 : // 可以没有返回 ...
- Windows核心编程&内核对象
1. 一个进程在初始化时,系统将会他分配一个空的句柄表,这个句柄表仅供内核对象使用,不供用户对象和GDI对象使用.进程在首次 初始化时,该句柄表为空.句柄表是一个由数据结构组成的数组,包含一个内核对象 ...