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 ...
随机推荐
- 浅析Entity Framework Core2.0的日志记录与动态查询条件
前言 Entity Framework Core 2.0更新也已经有一段时间了,园子里也有不少的文章.. 本文主要是浅析一下Entity Framework Core2.0的日志记录与动态查询条件 去 ...
- HTML表单属性集合
- Unity Object Pool完全体
using System; using System.Collections.Generic; using UnityEngine; using UnityEngine.Events; public ...
- JSP基础:JSP指令、JSP注释、JSP脚本、JSP声明、JSP表达式
JSP指令分为:page指令.include指令.taglib指令. page指令:通常位于JSP页面的顶端,同一个页面可以有多个页面指令. 语法:<%@ page language=" ...
- dedecms织梦上传图片302Error错误
很多客户反馈这样的问题,上传图片的时候会提示302错误,找不到原因,很着急,秀站网小编分析下如下解决办法,希望能帮助大家. 解决问题: 1:空间满了,请查看空间容量是否满了. 2:权限问题... 很多 ...
- es7重点笔记
1,函数绑定运算符,用来取代call,apply,bind调用,写法:并排的双冒号(::),左边是对象,右边是函数 foo :: bar; // 等同于bar.bind(foo); 双冒号返回的还是原 ...
- Android 基础:常用布局 介绍 & 使用(附 属性查询)
Android 基础:常用布局 介绍 & 使用(附 属性查询) 前言 在 Android开发中,绘制UI时常需各种布局 今天,我将全面介绍Android开发中最常用的五大布局 含 Andr ...
- float是什么样式?
什么是float样式? 让标签浮动起来,总体方向往上 right,left(右浮,左浮) 联合height,width使用,分别占用y方向和x方向多少,单位px或百分比(%) 作用对象不是页面,而是作 ...
- python_如何获取文件状态
案例: 在某项目中,需要获取文件状态,如: 文件的类型(普通文件.目录.符合连接.设备文件) 文件的访问权限 文件最后 访问.修改.节点状态 时间 普通文件大小 -- 如何解决? 方法1:通过os原始 ...
- awk解决实际问题例子
awk很有用,就不说了,下面记录几个我遇到的例子,汇总 1 获得linux环境变量(ENVIRON) awk 'BEGIN{print ENVIRON["PATH"];}' /et ...