ES12 中数组新增了一个可选参数——initialValue,它允许我们传递一个初始值给 Reducer
,这样就可以更加灵活地使用 reduce
函数了。
reduce 函数简介
reduce
是 JavaScript 中常用的方法之一,它可以将数组中的元素经过指定的操作(Reducer
)后得到一个单一的值。reduce
方法接收两个参数:
Reducer
函数,即对数组中的每个元素执行的操作函数,该函数包含 4 个参数:累加器(acc)、当前值(cur)、当前索引(idx)和原数组(srcArr);- (可选)累加器的初始值。
简单来说,reduce
函数的作用就是将一个数组中的元素一项一项地遍历,对其中每一项执行一个操作,最终将它们合并成为一个单一的值。
initialValue 的作用
在 ES12 中,我们还可以通过传递一个初始值给 Reducer
函数,来更精准地控制累加器的初始值。比如,如果我们不传递初始值,那么 JS 引擎会选择数组中的第一个元素作为初始累加器的值。但有些场景下,我们需要手动指定初始值,如下所示:
const arr = [1, 2, 3, 4, 5]; const result1 = arr.reduce((acc, cur) => acc + cur); // 不传递 initialValue const result2 = arr.reduce((acc, cur) => acc + cur, 100); // 传递初始值 initialValue = 100
这里,我们传递了初始值为 100
,因此 reduce
方法的返回值就是 100 + 1 + 2 + 3 + 4 + 5 = 115
。
initialValue 举例
下面,我们通过一个实际例子来说明 initialValue
的作用。假设我们有一个博客网站,现在想要统计每个用户发布的博客数量,我们可以这样做:
-- -------------------- ---- ------- ----- -------- - - - ----- -------- ------ ---------- -- - ----- -------- ------ ---------- -- - ----- -------- ------ ---------- -- - ----- -------- ------ ---------- -- - ----- -------- ------ ---------- -- - ----- -------- ------ ---------- -- -- -- ------------- ----- ------ - --------------------- ---- -- - -- --------------- - ---------------- - ---- - ------------- - -- - ------ ---- -- ---- -------------------- -- - ------ -- ------ -- ------ - -
这里我们可以看到,我们传递了一个空对象 {}
作为初始值,遍历文章数组,对于每篇文章,如果当前用户已经存在于累加器中,则把该用户的博客数量加 1,否则将该用户的博客数量设置为 1。
总结
有了 initialValue
参数,我们可以更加细致地控制累加器的初始值,从而更加灵活地使用 reduce
方法。应用场景非常广泛,如统计、合并等等。同时,对于初学者来说,掌握 reduce
及其可选参数是一个重要的学习和提高点。
来源:JavaScript中文网 ,转载请注明来源 https://www.javascriptcn.com/post/65a25cdfadd4f0e0ffa7eb23