ruduce函数

cartData.reduce在前端开发中非常常见，通常用于遍历购物车数组并计算商品的总价或总数量。

reduce是 JavaScript 数组的一个高阶函数，它的核心作用是将数组中的所有元素通过你设定的规则“累积”起来，最终合并成一个单一的值。

结合购物车（cartData）的实际场景，我为你写一个最典型的计算购物车总价的示例：

javascrip

1// 假设这是你的购物车数据 2const cartData = [ 3 { name: 'iPhone', price: 5000, count: 1 }, 4 { name: 'AirPods', price: 1200, count: 2 }, 5 { name: 'MacBook', price: 10000, count: 1 } 6]; 7 8// 使用 reduce 计算总价 9const totalPrice = cartData.reduce((total, item) => { 10 // total 是累积的总金额，item 是当前遍历到的商品 11 return total + (item.price * item.count); 12}, 0); // 这里的 0 是初始总金额 13 14console.log(totalPrice); // 输出: 17400

💡 代码原理解析

reduce接收两个主要参数：一个回调函数和一个初始值。

1. 回调函数(total, item) => { ... }：
   • total（累积器）：代表上一轮计算后累加的结果。
   • item（当前值）：代表当前正在处理的购物车商品对象。
2. 初始值0：
   • 代表total的起步价是 0。如果不传这个 0，reduce会默认把数组的第一个元素当作初始值，这在处理对象数组时会导致计算错误。