Javascript 'this'

Question

你能解释一下为什么第二次调用 fn 会出错吗？代码如下。

function Test(n) {
  this.test = n;

  var bob = function (n) {
      this.test = n;
  };

  this.fn = function (n) {
    bob(n);
    console.log(this.test);
  };
}

var test = new Test(5);

test.fn(1); // returns 5
test.fn(2); // returns TypeError: 'undefined' is not a function

这是一个重现错误 http://jsfiddle.net/KjkQ2/ 的 JSfiddle

Answer 1

您的 bob 函数是从全局范围调用的。因此，this.test 指向一个名为 test 的全局变量，它会覆盖您创建的变量。如果你运行 console.log(window.test)，你就会知道发生了什么。

为了让您的代码按预期运行，您需要以下之一

function Test(n) {
  this.test = n;

  // If a function needs 'this' it should be attached to 'this'       
  this.bob = function (n) {
      this.test = n;
  };

  this.fn = function (n) {
    // and called with this.functionName
    this.bob(n);
    console.log(this.test);
  };
}

或

function Test(n) {
  this.test = n;

  var bob = function (n) {
      this.test = n;
  };

  this.fn = function (n) {
    // Make sure you call bob with the right 'this'
    bob.call(this, n);
    console.log(this.test);
  };
}

OR 基于闭包的对象

// Just use closures instead of relying on this
function Test(n) {
  var test = n;

  var bob = function (n) {
      test = n;
  };

  this.fn = function (n) {
    bob(n);
    console.log(test);
  };
}