结果我在最后一个函数中的一个数字旁边得到了 NaN

Question

var john  = {
name: 'John Smith',
bills: [124,48,268,180,42],
tips : [],
final: [],
calcTips: function(){
    for(i = 0; i < this.bills.length;i++){
        if(this.bills[i] < 50){
            this.tips[i] = this.bills[i] * 0.2;
            this.final[i] = this.bills[i] + this.tips[i];
        } else if(this.bills[i] >= 50 && this.bills[i] <= 200){
            this.tips[i] = this.bills[i] * 0.15;
            this.final[i] = this.bills[i] + this.tips[i];
        } else{
            this.tips[i] = this.bills[i] * 0.1;
            this.final[i] = this.bills[i] + this.tips[i];
        }
    }
}

};

var mark  = {
name: 'Mark Smith',
bills: [77,375,110,45],
tips : [],
final: [],
calcTips: function(){
    for(i = 0; i < this.bills.length;i++){
        if(this.bills[i] < 100){
            this.tips[i] = this.bills[i] * 0.2;
            this.final[i] = this.bills[i] + this.tips[i];
        } else if(this.bills[i] >= 100 && this.bills[i] <= 300){
            this.tips[i] = this.bills[i] * 0.1;
            this.final[i] = this.bills[i] + this.tips[i];
        } else{
            this.tips[i] = this.bills[i] * 0.25;
            this.final[i] = this.bills[i] + this.tips[i];
        }
    }
}

};

function calcAverage(tips){
var sum = 0;
for(i = 0; i < tips.length ; i++){
    sum = tips[i] + sum;
}
return sum / tips.length;

}

mark.Average = calcAverage(mark.tips);
john.Average = calcAverage(john.tips);
mark.calcTips();
john.calcTips();
console.log(john);
console.log(mark);

函数 calcAverage 在平均值之外返回 NaN。 我对其进行了编码，因此它将循环提示数组并将提示加上总和添加到 sum 变量中。 有人能解释一下这个问题吗？

Answer 1

据我所知，平均小费是在小费实际存在之前计算的。如果你移动上面提示的计算，它应该可以正常工作：

mark.calcTips();
john.calcTips();
mark.Average = calcAverage(mark.tips);
john.Average = calcAverage(john.tips);
console.log(john);
console.log(mark);

Answer 2

尝试调用这些函数

mark.calcTips(); john.calcTips();

之前

mark.Average = calcAverage(mark.tips);
john.Average = calcAverage(john.tips);

因为调用 calcAverage() 函数时提示是空数组

代码应该是

mark.calcTips();
john.calcTips(); 
mark.Average = calcAverage(mark.tips);
john.Average = calcAverage(john.tips);

Answer 3

当您调用该函数时，问题围绕着“this”绑定。你可以看到calcTips 是使用apply() 调用的，但是我只是出于演示目的提取了该函数；这段代码仍然可以改进，但没有太大改变，所以你可以看看会发生什么；

查看代码sn-p：

var john = {
  name: "John Smith",
  bills: [124, 48, 268, 180, 42],
  tips: [],
  final: []
};

var mark = {
  name: "Mark Smith",
  bills: [77, 375, 110, 45],
  tips: [],
  final: []
};

function calcTips() {
  for (let i = 0; i < this.bills.length; i++) {
    if (this.bills[i] < 100) {
      this.tips[i] = this.bills[i] * 0.2;
      this.final[i] = this.bills[i] + this.tips[i];
    } else if (this.bills[i] >= 100 && this.bills[i] <= 300) {
      this.tips[i] = this.bills[i] * 0.1;
      this.final[i] = this.bills[i] + this.tips[i];
    } else {
      this.tips[i] = this.bills[i] * 0.25;
      this.final[i] = this.bills[i] + this.tips[i];
    }
  }
}

function calcAverage(tips) {
  var sum = 0;
  for (i = 0; i < tips.length; i++) {
    sum = tips[i] + sum;
  }
  return sum / tips.length;
}

//calling calcTips with "this" refers to mark 
calcTips.apply(mark);

//calling calcTips with "this" refers to john 
calcTips.apply(john);

mark.Average = calcAverage(mark.tips);
john.Average = calcAverage(john.tips);
console.log(john);
console.log(mark);

Answer 4

你在调用calcAverage之前调用calcTips，所以数组是空的。 calcAverage 以 return sum / tips.length 结尾。因为sum 是0 和tips.length 是0，那就是NaN（在JavaScript 中，0/0 是NaN，因为JavaScript 使用IEEE 754 双精度浮点数，它指定了这种行为）。

修复它：

1. 当tips.length 是0 时不要划分sum，并且
2. 在计算平均值之前先计算小费。