乐趣区

JavaScript 中遍历方法小结

遍历方法小结
常用的遍历方法

for 遍历
forEach(对数组的每个元素执行一次提供的函数)
map(创建一个新数组,其结果是该数组中的每个元素都调用一个提供的函数后返回的结果)

for 遍历大家都熟悉,所以重点讲一下 forEach 与 map 的区别

相同点:

回调函数参数相同,都自带三个属性:item / index / array
均不会修改原数组
第二参数 this 的指向均指向 window(可是使用箭头函数进行修改)
只能遍历数组
都不能使用循环跳出语句 break & continue

不同点:

forEach
返回值为 undefined

map

返回值为一个新的数组
可以链式调用

// 链式调用
var str = ‘abcde’;
// 使用 call 在字符类型中使用 map 方法
Array.prototype.map.call(str, function(x) {
return x;
}).reverse().join(”);
// edcba

其他遍历方法

filter (创建一个新数组, 其包含通过所提供函数实现的测试的所有元素)
find (返回数组中满足提供的测试函数的第一个元素的值。否则返回 undefined)
every (测试数组的所有元素是否都通过了指定函数的测试)
some (测试是否至少有一个元素通过由提供的函数实现的测试)

【Attention】filter 将遍历所有的元素 find & some & every 属于「条件中断」遍历(即当元素满足某一条件是返回 boolean)四个方法都不会对原数组进行修改

ES5 中的 for…in 遍历
常用于对象 key 值的遍历
ES6 引入的遍历方法

for…of 遍历
[前置知识:for…of 可对具有 iterator 接口的数据结构进行遍历]

原生具有 iterator 接口的数据结构如下:

Array
Set
Map
String
TypedArray
NodeList 对象
函数的 arguments 对象

keys() / values() / entries()
常用来遍历对象、数组、set、map 结构

【番外】

改变原数组的方法 pop、push、reverse、shift、sort、splice、unshift
不会改变原数组的方法 concat、join、slice、toString、toLocaleString、indexOf、lastIndexOf

退出移动版