es 遍历方法的区别

931 阅读1分钟

前言

JavaScript 发展至今已经发展出多种的循环遍历的方法 , 不同循环方法使用在那些场景。

以数组为例,JavaScript 提供多种遍历语法

常用方法

for 语句 最原始的写法就是for循环。

for (var index = 0; index < myArray.length; index++) {
  console.log(myArray[index]);
}

这种写法比较麻烦,因此数组提供内置的forEach方法

forEach

myArray.forEach(function (value) {
  console.log(value);
});

for 语句 相比 , 这种写法的问题在于,无法中途跳出forEach循环,break命令或return命令都不能奏效。

for...in 循环可以遍历数组的键名。

for (var index in myArray) {
  console.log(myArray[index]);
}

for...in循环有几个缺点。

  • 数组的键名是数字,但是for...in循环是以字符串作为键名“0”、“1”、“2”等等。

  • for...in循环不仅遍历数字键名,还会遍历手动添加的其他键,甚至包括原型链上的键。(可枚举)

  • 某些情况下,for...in循环会以任意顺序遍历键名。

总之,for...in循环主要是为遍历对象而设计的,不适用于遍历数组。

for...of循环相比上面几种做法,有一些显著的优点。

for (let value of myArray) {
  console.log(value);
}
  • 有着同for...in一样的简洁语法,但是没有for...in那些缺点。

  • 不同于forEach方法,它可以与break、continue和return配合使用。

  • 提供了遍历所有数据结构的统一操作接口。

下面是一个使用 break 语句,跳出for...of循环的例子。

for (var n of fibonacci) {
  if (n > 1000)
    break;
  console.log(n);
}

other

filter() : 对数组中的每一项运行给定函数 ,返回该函数会返回true的项组成的数组

map(): 对数组中的每一项运行给定函数 ,返回每次调用的结果组成的数组

some(): 对数组中的每一项运行给定函数 ,如果该函数对任一项返回true , 则返回true

every(): 对数组中的每一项运行给定函数 ,如果该函数对每一项返回true , 则返回true