为什么不同 JS 对象中的 my 方法会产生相同的结果？答案

【问题标题】：Why does the my method in different JS objects produce the same results?为什么不同 JS 对象中的 my 方法会产生相同的结果？
【发布时间】：2019-01-17 01:48:16
【问题描述】：

我正在学习 Javascript，因此我们将不胜感激。在下面的代码 sn-p 中，我创建了两个对象 johnTip 和 markTip，用于计算 John 和 Mark 的提示摘要。对于两个对象，tipCalculator 方法的实现方式相同。但是，在调用 markTip.calcTip() 之后，我发现tipsJohn 会被tipsMark 覆盖，即它们具有相同的值。有谁知道幕后出了什么问题以及如何解决这个问题？谢谢。

我试过在johnTip和markTip上切换调用这个方法的顺序，但没有修复bug。

预期的结果是tipsJohn 和tipsMark 是独立的对象（数组）。但是，在调用 markTip.calcTip 之后，它们似乎具有相同的值。

var johnTip = {
  bills: [124, 48, 268, 180, 42],
  calcTip: function() {
    tips = [];
    finalBills = [];
    for (var i = 0; i < this.bills.length; i++) {
      if (this.bills[i] < 50) {
        tips[i] = this.bills[i] * 0.2;
      } else if (this.bills[i] < 200) {
        tips[i] = this.bills[i] * 0.15;
      } else {
        tips[i] = this.bills[i] * 0.1;
      }
      finalBills[i] = tips[i] + this.bills[i];
    }

    return [tips, finalBills];
  }
}

var markTip = {
  bills: [77, 375, 110, 45],
  calcTip: function() {
    tips = [];
    finalBills = [];
    for (var i = 0; i < this.bills.length; i++) {
      if (this.bills[i] < 100) {
        tips[i] = this.bills[i] * 0.2;
      } else if (this.bills[i] < 300) {
        tips[i] = this.bills[i] * 0.10;
      } else {
        tips[i] = this.bills[i] * 0.25;
      }
      finalBills[i] = tips[i] + this.bills[i];
    }

    return [tips, finalBills];
  }
}

let [tipsJohn, finalBillsJohn] = johnTip.calcTip();
let [tipsMark, finalBillsMark] = markTip.calcTip();
console.log('Mark\'s tip summary: ' + tipsMark);
console.log('Mark\'s final bills paid: ' + finalBillsMark);
console.log('John\'s tip summary: ' + tipsJohn);
console.log('John\'s final bills paid: ' + finalBillsJohn);

【问题讨论】：

尝试正确声明变量，例如 const tips = []; 和 const finalBills = [];。
问题出在哪里 - Marks 和 John 的提示不同 - ？
@KamilKiełczewski - 这可能是由于我的编辑。为了消除不声明tipsJohn, finalBillsJohn, tipsMark, finalBillsMark所产生的语法错误。我添加了let 以声明和定义它们。
@RandyCasburn 你毁了所有的乐趣 ;)
我没有说它导致了这个问题。但是如果你没有正确声明你的变量，你可能会在某些时候遇到这样的问题。

标签： javascript object methods

【解决方案1】：

当您分配一个变量而不对其进行贴花时，它具有全局范围。

x = 5;

创建一个全局变量。

let x = 5;

创建一个只对当前块有作用域的变量。

将两个数组都更改为

let tips = [];

let finalBills = [];

它们将是不同的数组。

【讨论】：

【解决方案2】：

您在 markTip 和 johnTip 的声明之外声明了 var finalBills;。您需要将它们存储在不同的var。

【讨论】：

没关系，因为每次调用方法时它都会重新分配变量，它不会重用旧数组。