我不知道的 JS——高阶函数篇

JS 是一个充满魔性的语言,每次打开 MDN 都会无意间发现一些以前错过的细节。有本书叫《You don’t know JS》,书名满载着作者的善意嘲讽。可是他说的没错,我的 JS 目前还是千疮百孔,下面写一写最近在 JS 上补了哪些窟窿吧。

语法中的中括号[]代表可选参数。

正文

bind

语法:

1
fun.bind(thisArg[, arg1[, arg2[, ...]]])

bind 除了最常用的给函数指定上下文外,还可以给函数预先传入参数,变成偏函数(Partial Function)。这样经过 bind 的函数,每次调用,都会带着之前传入的参数一起运行。比如:

1
2
3
4
5
function add(a, b) {
return a + b
}
var addTwo = add.bind(null, 2)
console.log(addTwo(3)) // 输出:5

reduce

语法:

1
arr.reduce(callback[, initialValue])

callback 有两个必填参数:accumulator 和 currentValue,两个可选参数:currentIndex 和 array。

参数很多,但是看名称就很清楚代表什么,注意第一个是 accumulator,保存每次计算的结果。initialValue 指的就是 accumulator 的初始值。当没有 initialValue 时,accumulator 会把数组的第一个元素当做初始值。

下面直接照搬 MDN 上的一个例子说明:

1
2
3
4
5
6
[0, 1, 2, 3, 4].reduce(
(accumulator, currentValue, currentIndex, array) => {
return accumulator + currentValue
},
10
)
callback accumulator currentValue currentIndex array return value
first call 10 0 0 [0, 1, 2, 3, 4] 10
second call 10 1 1 [0, 1, 2, 3, 4] 11
third call 11 2 2 [0, 1, 2, 3, 4] 13
fourth call 13 3 3 [0, 1, 2, 3, 4] 16
fifth call 16 4 4 [0, 1, 2, 3, 4] 20

substirng() 和 substr() 的区别

语法:

1
2
3
str.substring(indexStart[, indexEnd])

str.substr(start[, length])

substring 的两个参数分别是起始的索引下标和结束的索引下标

substr 的两个参数分别是起始的索引下标和长度。

splice

语法:

1
array.splice(start[, deleteCount[, item1[, item2[, ...]]]])

splice 是直接在数组上操作的,注意它的返回值是所删除元素组成的数组,而不是这个数组本身!所以arr.splice(...).slice()这样的链式调用写出来往往是错的。

Array.from()

Array.from 不仅能够把 array-like 或可遍历的对象转换为数组,它还有一个可选参数 mapFn!所以Array.from(obj, mapFn, thisArg)Array.from(obj).map(mapFn, thisArg)是等价的。

于是,我们可以把两步并成一步:

1
console.log(Array.from([1, 2, 3], x => x * x)) // [1, 4, 9]
0%