Question

我对以下代码打印出“this.text”有疑问。

我需要一个包装函数才能使它工作。这太麻烦了。

是否有更简单的方法（没有额外的包装器）才能使其正常工作？

  function Class1() {
    this.text = "test";
  }

  Class1.prototype.show = function() {
    console.log(this);
    console.log(this.text);
  }

  var testClass = new Class1();

  function funWithCallBack(cb) {
    cb();
  }

  // it will show "undefined" because "this" scope changes to window
  funWithCallBack(testClass.show); 

  function wrapper() {
    testClass.show();
  }

  // this one will work but troublesome
  funWithCallBack(wrapper)

Answer 1

你可以使用这样的匿名函数：

// it will show "undefined" because "this" scope changes to window
funWithCallBack(testClass.show);

到此：

// anonymous function to use the right object for the method
funWithCallBack(function() {
    testClass.show()
});

出现问题是因为当您将testClass.show作为回调传递时，它只会获取函数引用，并且不再与testClass关联。但是，您可以创建一个临时函数，使用.bind()将它们绑定在一起，但在某些旧版浏览器中不支持，这就是我通常只使用匿名函数的原因。

.bind()实现如下所示：

// use .bind() to make sure the method is called in the right object context
funWithCallBack(testClass.show.bind(testClass));

如何在类范围内使用“this”进行回调

1 个答案: