javascript - "this"返回未定义

Question

我正在编写一个每秒运行一个对象方法的 JavaScript 程序。该方法只是记录对象的属性“x”，然后将其加一。

从中构造对象(称为“玩家”)的类称为“Snake”，属性“x”明确定义为 0。但是，当通过我的“everyTick”函数时，它记录“undefined” '.

这很奇怪，因为该方法还记录了 player.x，这正是它应该做的。但是当我使用“this”而不是“player”时，它会记录未定义。任何人都可以解释为什么以及如何解决它吗？

这是代码。

var FPS = 1;
var toBeRun = {
  func: function() {},
  index: 0
};

function tickFunction(func) {
  this.func = function() {
    func();
  }
}

function everyTick() {
  toBeRun.func()
  setTimeout(function() {everyTick();}, 1000 / FPS);
}

function forever(func) {
  toBeRun = new tickFunction(func);
}


function Snake() {
  this.x = 0;

  this.say = function() {
    console.log(player.x);
    console.log(this.x);

    player.x++;
    this.x++;
  }
}


var player = new Snake();

function start() {
  forever(player.say);
}

everyTick();

当你只是那样看的时候真的很困惑，所以在 CodePen 中: http://codepen.io/Plygon/pen/jqJZvq?editors=0011

Answer 1

这是因为，当您调用 forever 时，您正在传递对 player.say 函数的引用，但该引用未绑定(bind)到 Snake 对象。所以当函数被调用时，它并不知道 this 是什么。

这是一个简单的例子:

function Person(name) {
    this.name = name;
    this.say = function () {
        return this.name;
    };
}

var p = new Person('Bob');
console.log(p.say()); // Bob
var fn = p.say;
console.log(p.say()); // undefined;

您需要做的是将函数绑定(bind)到对象。该函数的 bind 方法返回一个新函数，其中 this 绑定(bind)到您传递给 bind 的任何对象:

var boundFn = p.say.bind(p);
console.log(boundFn()); // Bob

所以，如果你这样做:

forever(player.say.bind(player));

您应该能够在 say 函数中使用 this。