JavaScript 数组累加怎么用 reduce 计算总金额-js教程-PHP中文网

用 reduce 计算商品总金额需传入累加函数和初始值 0；处理 price 字符串或空值时用 parsefloat() || 0 安全转换；含 quantity 时先算 item.price * item.quantity；链式操作可先 filter 再 map 最后 reduce。

javascript 数组累加怎么用 reduce 计算总金额

用 reduce 计算数组中商品的总金额，核心是传入一个累加器函数，把每项的价格逐步加起来，初始值设为 0。

基础写法：直接累加 price 字段

假设数组每一项是对象，含 price（数字类型）：

const items = [
  { name: '苹果', price: 5.5 },
  { name: '香蕉', price: 3.2 },
  { name: '橙子', price: 4.8 }
];
<p>const total = items.reduce((sum, item) => sum + item.price, 0);
console.log(total); // 13.5
</p>

第一个参数：(sum, item) => sum + item.price 是累加函数，sum 是上一轮结果（初始为 0），item 是当前元素
第二个参数：0 是初始值，必须显式提供，否则第一次调用时 sum 会是第一个元素，易出错

处理 price 是字符串或可能为空的情况

实际数据中 price 可能是字符串（如 "19.9"）、null 或 undefined，需安全转换：

Alibabacloud Sdk Client Initialization For Java

在 Java 中初始化和管理阿里云 SDK客户端。包括单例模式、线程安全、endpoint 与 region 配置、VPC 终端节点、同步与异步等。

下载

const total = items.reduce((sum, item) => {
  const price = parseFloat(item.price) || 0;
  return sum + price;
}, 0);

用 parseFloat() 转数字，失败返回 NaN，再用 || 0 转成 0
避免 NaN + 数字 = NaN 导致整个结果失效

带数量（quantity）的总价计算

如果每项还有购买数量，需先算单个商品小计，再累加：

const items = [
  { name: '咖啡', price: 25, quantity: 2 },
  { name: '牛奶', price: 8, quantity: 1 }
];
<p>const total = items.reduce((sum, item) => sum + (item.price * item.quantity), 0);
console.log(total); // 58
</p>

关键点：在累加器里计算 item.price * item.quantity，再加到 sum
确保 price 和 quantity 都是有效数字，必要时同样用 parseFloat + || 0 安全处理

链式处理：过滤 + 映射 + 累加

比如只算「已付款」订单的金额：

const paidItems = orders
  .filter(order => order.status === 'paid')
  .map(order => parseFloat(order.amount) || 0)
  .reduce((sum, amount) => sum + amount, 0);