javascript - 无法使用 forEach 动态创建数组

Question

在下面的代码中，当我控制台 calculateTips() 的值时，出现以下错误

Uncaught TypeError: Cannot set property '0' of undefined

let tipCal = {
  bills: [124, 48, 268, 180, 42],
  calculateTips: function() {
    this.tips = [];
    this.finalValue = [];
    (this.bills).forEach(function(item, index) {
      if (item < 50) {
        this.tips[index] = (item * .2);
      } else if (item >= 50 && item < 200) {
        this.tips[index] = (item * .15);
      } else {
        this.tips[index] = (item * .1);
      }
    });
    return this.tips;

  }
}

我无法理解为什么会出现此错误，因为根据我的说法，我正在做正确的事情。请帮忙。

Answer 1

有几点需要注意。首先，据我所知，使用索引表示法代替 Array.prototype.push 并不常见。由于您是从头开始构建 this.tips，因此可以使用 this.tips.push(...)。使用 push 有时也可以获得更好的性能。参见这里:Why is array.push sometimes faster than array[n] = value?

其次，是的，使用 function 会更改 this 的上下文，因此 this 在 forEach 中> 回调指的是回调函数而不是tipCal。按照建议使用箭头函数将保留 this 的上下文。