0%

JS高阶函数

map()

创建一个新数组,其中每一个元素由调用数组中的每一个元素执行的函数得来

1
2
3
let arr = [1, 2, 3]
let newArr = arr.map((value, index, array) => value * 2)
console.log(newArr) //[2,4,6]

forEach 和 map 的不同

forEach 不会返回新的数组,但 forEach()也不会改变原有的数组,但 callback 函数可能会改变原有的数组.

1
2
3
let arr = [1,2,3]
let newArr = arr.forEach((value,index,array) => value * 2)
console.log(newArr) //undefined

forEach 中的 callback 函数改变原数组

1
2
3
let arr = [1,2,3]
arr.forEach((item,index)=>a[index]=0)
console.log(arr) //[0,0,0]

filter()

filter 接受一个函数,把传入的函数依次作用于每个元素,然后根据返回值是 true 还是 false 决定保留还是丢弃该元素

1
2
let arr = [1, 2, 3, 4, 5]
let newArr = arr.filter((value, index, array) => value % 2 !== 0) //[1,3,5]

sort()

sort 接收一个比较函数来实现自定义的排序

1
2
3
4
5
6
7
8
9
10
11
let arr = [10, 20, 1, 2]
arr.sort((x, y) => {
if (x < y) {
return -1
}
if (x > y) {
return 1
}
return 0
})
console.log(arr) // [1,2,10,20]

这里多说一下,JS 的默认排序规则是根据字符的 ascii 码进行的。

1
[10, 20, 1, 2].sort(); // [1, 10, 2, 20]

sort 方法默认把所有元素转成String 再排序,结果 ‘10’ 排在 ‘2’ 前面,因为字符 ‘1’ 比 字符 ‘2’ 的 ASCII 码小。

reduce()

reduce 把一个函数作用在 Array 的[x1,x2,x3 …]上,这个函数必须接收两个参数,reduce 把结果继续和序列的下一个元素做累积计算,相当于:

1
[x1, x2, x3, x4].reduce(f) = f(f(f(x1, x2), x3), x4)

reduce 实现求和:

1
2
let arr = [1, 3, 5, 7, 9]
arr.reduce((x, y) => x + y) //25

也可以设置初始值:

1
2
let arr = [1, 3, 5, 7, 9]
arr.reduce((sum, x) => (sum += x), 0) //25

every()

every()方法可以判断数组的所有元素是否满足测试条件

1
2
let arr = [1, 2, 3, 4, 5]
console.log(arr.every((item) => item > 3)) //false

find()

find()方法用于查找符合条件的第一个元素,如果找到了,就返回这个元素,否则,返回 undefined

1
2
let arr = [1, 2, 3]
console.log(arr.find((item) => item === 3)) //3

findIndex()

findIndex()和 find()类似,也是查找符合条件的第一个元素,不同之处在于 findIndex()会返回这个元素的索引,如果没有找到,返回 -1

1
2
let arr = [1, 2, 3]
console.log(arr.findIndex((item) => item === 3)) //2

includes()

includes() 方法用来判断一个数组是否包含一个指定的值,如果是则返回 true,否则 false

1
2
3
let site = ['runoob','google','taobao']
site.includes('runoob') //true
site.includes('baidu') //false

indexOf()

indexOf() 方法可返回数组中某个指定的元素位置,如果在数组中没有找到指定的元素则返回 -1

1
2
let fruits = ["Banana","Orange","Apple","Mango"]
console.log(fruits.indexOf("Apple")) // 2