Question

我无法定义正确的术语，以及我对以下代码的理解是否正确。

我创建了一个构造函数

function BoardGame () {
    this.count = 10;
    this.random = Math.floor((Math.random() * 100) + 1);
}

BoardGame.prototype.getNumber = function(){
    // this is a button that is clicked
    $('.inputField').on('click', function (event) {
        this.guess= parseInt($('#inputField').val(), 10);
        $("'#inputField'").val("");
          this.validChecker();
      }.bind(this));
}

BoardGame.prototype.validChecker = function() {
    if (this.guess < 1 || this.guess > 100) {
    $('#warning').append($('<p></p>'));
  }
};

BoardGame.prototype.newGame = function () {
    game = new BoardGame();
}

$(document).ready(function(){
    game = new BoardGame();
    game.getNumber();
});

在document.ready函数中，创建了一个新的BoardGame实例，并将引用设置为全局范围内的game变量。

然后，创建事件监听器。

当点击getNumber中的事件监听器时，它会传递＆＃34;这个＆＃34;上下文（游戏），它使用它作为此引用。它会调用this.validChecker()。

在某些时候，会调用game.newGame()。现在，将一个新的boardGame实例重新分配给游戏变量。如果我查看我的＆＃34;这个＆＃34;引用，它引用旧的BoardGame对象（在重新分配之前），而不是最近创建的新BoardGame实例。

如果我将newGame代码更改为：

BoardGame.prototype.newGame = function () {
    BoardGame.call(this);
}

运行newGame函数，＆＃34; this＆＃34;引用，更新和更改当前对象属性到BoardGame构造函数中的属性。它转到实际对象而不是重新分配。我不确定为什么这会产生如此大的差异，不应该对新分配的对象进行此更改的上下文？

当我在newGame函数中调用新的BoardGame（）时，为什么没有＆＃34;这个＆＃34;引用更改为新对象？

似乎改变当前对象与重新分配新对象之间存在差异，即使我可以更改对象的属性。这是怎么回事？

当我在newGame（）和＆＃34;这个＆＃34;中调用新的BoardGame时在reassignmnt之后引用旧对象，什么是保持对旧对象的引用，这是一个闭包吗？范围？参考对象与价值观念对象？

编辑：我想补充一点，当我＆＃34;重置＆＃34;与＃34;新的BoardGame（）＆＃34;然后单击按钮，＆＃34;这个＆＃34;引用旧对象。但是，如果我打电话给game.getNumber();就可以了，那就是＆＃34;这个＆＃34;引用新的游戏对象，这就是我所期望的。

我相信正在发生的事情的基础与这个例子有关，即使我没有100％清楚地掌握这个概念。

var a = {a: "A"};
var b = a;

a = "hello"
b; // still references {a: "A"}

所以在我的场景中，创建事件监听器时的上下文是原始对象。然后，当在newGame函数中调用new BoardGame时，游戏引用了更改，但是＆＃34; this＆＃34;引用仍然引用原始对象（不确定为什么它不会随之改变）。

当我们使用BoardGame.call（this）时，无论我们在哪里看，它都只引用所有代码中的一个对象。我们不会创建第二个对象。

Answer 1

我不确定我是否完全理解你的困惑，希望以下有帮助。

当您致电 game.newGame 时：

BoardGame.prototype.newGame = function () {
    game = new Game();
}

所有发生的事情是将 BoardGame 实例分配给游戏，使用 bind 绑定到侦听器的前一个实例尚未改变。

如果我将newGame代码更改为：

BoardGame.prototype.newGame = function（）{       BoardGame.call（本）;   }

将构造函数作为函数调用，并将旧的游戏对象作为 this 传递给构造函数。它只是更新传递给它的游戏对象的属性，它不会创建一个新属性。

运行newGame函数，＆＃34; this＆＃34;参考，更新和将当前对象属性更改为中的属性 BoardGame构造函数。它转到实际的对象而不是重新分配。

是的，因为你传递了＆＃34;实际对象＆＃34;如 this ，没有新对象。

我不确定为什么这会产生如此大的差异，不应该对新分配的对象进行此更改的上下文？

这个不是＆＃34; context＆＃34;，它是函数执行上下文的属性，由你调用函数的方式设置。

它有很大的不同，因为没有新对象，因为 BoardGame 没有被 new 调用，所以你将它作为一个函数调用，而不是构造函数。

这个不是在一个闭包中，它是由 bind 设置的（在这种情况下它是静态的）或者是如何通过来调用该函数每次通话。它总是在当前函数的执行上下文中解析（ES6箭头函数改变了它，但它们在这里并不相关）。

修改

我认为你可以从编辑到OP。

Answer 2

新游戏中的这部分代码是否应该起作用：

new Game();

这样读取：

new BoardGame();

编辑：没关系。我看到你在打字的时候做了改变。

变量＆＃34;这个＆＃34;重新分配变量后上下文不更新

2 个答案:

修改