JS计算账单总金额出现NaN问题求助

嘿，我一眼就找到问题所在啦！你控制台里totals输出NaN的原因其实很简单：

你给tips数组赋值的代码是：

tips = [calcTip(bills[1])];

这时候tips数组里只有索引0的位置有值（也就是对应bills第二项的小费），但你计算totals的时候却用了tips[1]——这个位置根本没有元素，结果是undefined！数字和undefined相加自然就得到NaN了。

修正后的代码 #

你只需要把tips[1]改成tips[0]就行，或者换一种更清晰的写法，先单独计算小费再组装数组：

const bills = [22, 295, 176, 440, 37, 105, 10, 1100, 86, 52];
let tips = [];
let totals = [];

const calcTip = function (bills) {
  return bills >= 50 && bills <= 300 ? bills * 0.15 : bills * 0.2
}

// 单独计算第二项的小费，逻辑更清晰
const secondTip = calcTip(bills[1]);
tips = [secondTip];
// 用计算好的小费算总金额，或者直接用tips[0]
totals = [bills[1] + secondTip];
// 也可以写成 totals = [bills[1] + tips[0]];

console.log(bills, tips, totals);

运行这段代码后，totals就会正确输出[339.25]（也就是295 + 44.25的结果）啦！

另外顺便提一句，你注释掉的遍历数组的代码也有个小问题：const newTips = [calcTip(bills[i])];这里把小费包成了数组，push到tips里会让tips变成二维数组，直接push计算后的小费值就好，比如：

for (let i = 0; i < bills.length; i++) {
    const tip = calcTip(bills[i]);
    tips.push(tip);
    totals.push(bills[i] + tip);
}

内容的提问来源于stack exchange，提问作者asmmargod