数组方法

预计阅读时间: 2 分钟

遍历方法概览

forEach

forEach 单纯就是用来遍历数组的(看起来很废物,但是巨常用)

函数签名

1Array.prototype.forEach<T>(callback:(item:T,index:number,array:T[]),thisArg:any):void;

函数签名解析

我们从函数签名可以看出他接受一个回调参数和一个回调参数的 this 指向,然后运行完之后啥都不返回

特点

循环次数

和 for 循环等普通循环类似,但是他不会因为原数组的修改而改变循环次数

1const arr = [1, 2, 3]
2
3arr.forEach((item, index) => {
4  console.log(index, item)
5  arr.push(index)
6})
7
8console.log(arr)
output
10 1
21 2
32 3
4[1,2,3,0,1,2]

对比普通循环

1const arr = [1, 2, 3]
2
3for (let i = 0; i < arr.length; i++) {
4  console.log(i, arr[i])
5  arr.push(i)
6  if (i === 10) {
7    break
8  }
9}
10
11console.log(arr)
output
10 1
21 2
32 3
43 0
54 1
65 2
76 3
87 4
98 5
109 6
1110 7
12[1,2,3,0,1,2,3,4,5,6,7]

可以看出如果我不在 i 等于 10 的时候中断循环的话那他就会无限循环下去

当然你也可以用下面这种方式模拟 forEach 的循环次数

1const arr = [1, 2, 3]
2const length = arr.length
3
4for (let i = 0; i < length; i++) {
5  console.log(i, arr[i])
6  arr.push(i)
7}
8
9console.log(arr)
output
10 1
21 2
32 3
4[1,2,3,0,1,2]

map

filter

find

findIndex

every

some

reduce