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,数组遍历的更多相关文章

  1. 关于 ES5 & ES6 数组遍历的方法

    ES5 数组遍历方法 1.for 循环 , , , , ] ; i < arr.length; i++) { console.log(arr[i]) } 2.forEach , , , , ] ...

  2. ES6 数组遍历方法的实战用法总结(forEach,every,some,map,filter,reduce,reduceRight,indexOf,lastIndexOf)

    目录 forEach every some map filter reduce && reduceRight indexOf lastIndexOf 前言 ES6原生语法中提供了非常多 ...

  3. JS几种数组遍历方式以及性能分析对比

    前言 这一篇与上一篇 JS几种变量交换方式以及性能分析对比 属于同一个系列,本文继续分析JS中几种常用的数组遍历方式以及各自的性能对比 起由 在上一次分析了JS几种常用变量交换方式以及各自性能后,觉得 ...

  4. js数组遍历和对象遍历

    针对js各种遍历作一个总结分析,从类型用处:分数组遍历和对象遍历:还有性能,优缺点等. JS数组遍历: 1,普通for循环,经常用的数组遍历 var arr = [1,2,0,3,9]; for ( ...

  5. 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 ...

  6. 数组的复制及ES6数组的扩展

    一.数组的复制 // alert([1,2,3]==[1,2,3]); let cc = [0,1,2]; let dd = cc; alert(dd==cc);//此时改变dd会影响cc ES5 只 ...

  7. js数组遍历方法总结

    数组遍历方法 1.for循环 使用临时变量,将长度缓存起来,避免重复获取数组长度,当数组较大时优化效果才会比较明显. 1 2 3 for(j = 0,len=arr.length; j < le ...

  8. es6数组的扩展

    数组扩展运算符 ...(三个点) const demoArr=[0,1,2,3,4] console.log(...demoArr) // 0 1 2 3 4 // 他把一个数组用逗号分隔了出来 // ...

  9. ES6 数组方法拓展

    ES6 数组方法拓展 1.Array.from() Array.from方法用于将两类对象转为真正的数组:类似数组的对象(array-like object)和可遍历(iterable)的对象(包括E ...

  10. ES6数组相关

    ES6数组新增的几个方法: 1. forEach() //forEach()遍历数组,无返回值,不改变原数组 var arr=[1,2,3,4] arr.forEach((item,index,arr ...

随机推荐

  1. 访问网时出现403 Forbidden错误的原因:

    1.你的IP被列入黑名单.2.你在一定时间内过多地访问此网站(一般是用采集程序),被防火墙拒绝访问了.3.网站域名解析到了空间,但空间未绑定此域名.4.你的网页脚本文件在当前目录下没有执行权限.5.在 ...

  2. don\'t have permission access on this server听语音

    在网络上已经有很多的类型较多的框架,例如wamp,xmap等基于apache+mysql集成的框架,只要通过架包的方式,把相关的内容放到与这些的框架中后,启动服务器就可以执行架包内容,而在初始安装完成 ...

  3. kafka和strom集群的环境安装

    前言 storm和kafka集群安装是没有必然联系的,我将这两个写在一起,是因为他们都是由zookeeper进行管理的,也都依赖于JDK的环境,为了不重复再写一遍配置,所以我将这两个写在一起.若只需一 ...

  4. 那些年~~~我们的C#笔试内测题目

    <深入.NET平台和C#编程>内部测试题-笔试试卷 一 选择题 1) 以下关于序列化和反序列化的描述错误的是( C). a) 序列化是将对象的状态存储到特定存储介质中的过程 b) 二进制格 ...

  5. 如何开发由Create-React-App 引导的应用(四)

    此文章是翻译How to develop apps bootstrapped with Create React App 官方文档 系列文章 如何开发由Create-React-App 引导的应用 如 ...

  6. 自动化测试框架Selenium工作原理

    本文所讲的Selenium是指Selenium Webdriver Selenium WebDriver与RC的功能相同,并且包含原始的1.x绑定.它涉及语言绑定和单个浏览器控制代码的实现.这通常被称 ...

  7. java进行图片和字符串的互相转换

    今天做项目,突然发现图片居然能转成字符串,字符串也能转成图片. 接下来让我们进行代码演示吧! /** * 字符串转图片 * @param imgStr --->图片字符串 * @param fi ...

  8. javascript函数创建

    函数声明 function add(a,b){ return a+b } 函数表达式 <!--一般函数表达式--> var add = function(){ } <!--立即声明函 ...

  9. 共轭梯度算法求最小值-scipy

    # coding=utf-8 #共轭梯度算法求最小值 import numpy as np from scipy import optimize def f(x, *args): u, v = x a ...

  10. python3的一些改动常用到的

    更多的内容会接下来说明,只举几个例子. https://docs.python.org/2/library/2to3.html 1. map的输出,要在前面加list转化 2. map(lambda ...