Question

我不知道如何妥善处理此案。我有一个像这样的Javascript对象：

var myClass = {

    init : function(){
        $("button").on("click" , this.func1);
    },

    func1: function(){

        // do stuffs

        this.func2();

    },

    func2: function(){

        // do stuffs
    }
}

myClass.init();

当我为绑定事件初始化我的类时没有问题。在init函数中，this的值是类本身，所以我可以毫无问题地调用它们的方法。

考虑到点击按钮时，我执行了func1。我在函数func1中发现了问题，因为在这种情况下this的值是按下的按钮，所以当我尝试this.func2时，我得到Uncaught TypeError: this.func2 is not a function。

我如何处理这类问题？我确信有一种解决这个问题的标准方法，但我不知道。

谢谢！

Answer 1

从您的示例中，this.func1实际上在执行时不绑定任何上下文。因此，this关键字将被window上的legacy mode对象或undefined上的strict mode后备。要在this.func1上下文中执行myClass，您可以使用以下方法之一：

使用Function.prototype.bind
将this设置为myClass
```
$("button").on("click", this.func1.bind(this));
```

包含匿名函数

var self = this;
$("button").on("click", function() {
  self.func1();
});

包裹arrow function

$("button").on("click", () => this.func1());

从同一个类

1 个答案: