js中数组遍历的几种方法及其区别,js数组遍历的几种方法

js中数组遍历的几种方法及其区别,js数组遍历的几种方法,JS中循环遍历数组的四种方式总结

本文主要总结了JS中循环数组的四种方法。通过示例代码详细介绍,对您的学习或工作有一定的参考价值。如果你需要,让我们和边肖一起学习吧。

本文比较并总结了四种遍历数组的方法:

For循环:

for(设索引=0;index someArray.length索引){

const elem=some array[index];

//

}

For-in循环:

for(some array中的常量键){

console . log(key);

}

方法。forEach():

someArray.forEach((elem,index)={

console.log(elem,index);

});

For-of循环:

for(some array的const elem

console . log(elem);

}

For-of通常是最佳选择。我们会明白为什么。

For循环[ES1]

JavaScript中的for循环非常古老,ECMAScript 1中就已经有了。For循环记录arr的每个元素的索引和值:

const arr=[a , b , c ];

arr.prop=属性值;

for(设索引=0;索引数组长度;索引){

const elem=arr[index];

console.log(index,elem);

}

//输出:

//0,“a”

//1, b

//2, c

for循环的优缺点是什么?

它被广泛使用,但当我们必须遍历数组时,它也很麻烦。

如果我们不想从第一个数组元素开始循环,并且它仍然有用,那么用其他循环机制很难做到这一点。

For-in循环[ES1]

for-in循环和for循环一样古老,它也存在于ECMAScript 1中。以下代码使用for-in循环输出arr的密钥:

const arr=[a , b , c ];

arr.prop=属性值;

for(数组中的常量键){

console . log(key);

}

//输出:

//0

//1

//2

//道具

For-in不是遍历数组的好方法:

它访问属性键,而不是值。

作为属性键,数组元素的索引是字符串,而不是数字。

它访问所有可枚举的属性键(自己的和继承的),而不仅仅是数组元素的属性键。

for-in访问继承属性的实际目的是遍历对象的所有可枚举属性。

方法。forEach()[ES5]

因为for和for-in都不太适合在数组上循环,所以ECMAScript 5:

const arr=[a , b , c ];

arr.prop=属性值;

arr.forEach((elem,index)={

console.log(elem,index);

});

//输出:

//a ,0

//b ,1

//c ,2

这个方法非常方便:它使我们能够访问数组元素和索引,而不需要很多操作。如果使用arrow函数(ES6中引入的),在语法上会更优雅。

的主要缺点。forEach()是:

Await不能在其循环体中使用。

您不能退出。forEach()循环提前。可以在for循环中使用break。

中止…的解决。forEach()

如果你想中止一个循环。forEach(),有一个解决方法:some()也将遍历所有数组元素,并在其回调返回true值时停止。

const arr=[red , green , blue ];

arr.some((elem,index)={

if (index=2) {

返回true//中止循环

}

console . log(elem);

//此回调隐式返回未定义的

//是一个伪值。因此,循环继续。

});

//输出:

//红色

//绿色

可以说这是一种滥用。一些()。与for-of和break相比,这段代码并不容易理解。

For-of循环[ES6]

ECMAScript 6中支持for-of循环:

const arr=[a , b , c ];

arr.prop=属性值;

for(数组的常数元素){

console . log(elem);

}

//输出:

//a

//b

//c

For-of在循环遍历数组时非常有效:

用于遍历数组元素。

您可以使用await。

如果需要,您可以轻松地迁移到for-await-of。

您甚至可以对外部范围使用中断并继续。

For-of和iterable对象

For-of不仅可以遍历数组,还可以遍历迭代对象,比如Map:

const myMap=新地图()。设置(假,“否”)。设置(真,是)

for(myMap的const [key,value ]){

console.log(键,值);

}

//输出:

//false,“否”

//真,是

遍历myMap会生成[key,value]对,可以通过解构直接访问。

For-of和数组索引

数组。entries()返回一个迭代[索引,值]对。如果使用for-of并通过此方法进行解构,则可以很容易地访问数组索引:

const arr=[巧克力,香草,草莓];

for(arr . entries()的const [index,elem]){

console.log(index,elem);

}

//输出:

//0,巧克力

//1,香草

//2,草莓

摘要

for-of循环的可用性优于for、for-in和。forEach()。

通常,四种循环机制之间的性能差异应该是不显著的。如果想做一些计算量比较大的事情,还是换成WebAssembly比较好。

这就是本文关于JS中循环数组的四种方法的总结。有关在JS中循环数组的更多信息,请搜索我们以前的文章或继续浏览下面的相关文章。希望大家以后能多多支持我们!

js中数组遍历的几种方法及其区别,js数组遍历的几种方法