首页 > 解决方案 > 从类内部调用函数时,Javascript 类 this.x 不是函数

问题描述

我有一个按钮,按下时应该调用一个调用另一个函数的函数。这是在一个类里面。

class cat{
    constructor(){
        this.event_listener();
    }

    log_2(){
        console.log("cat 2");
    }
    log_1(){
        console.log("cat 1");
        this.log_2();
    }

    event_listener(){
        document.getElementById("cat_button").addEventListener("click", this.log_1);
    }
}

let cat1 = new cat();

第一个函数 this.log_1() 在按下按钮时调用并按预期输出“cat 1”,但随后出现错误

this.log_2 is not a function

出现在控制台上,尽管 log_2() 是在类中定义的。如何构造它以便将 log_2() 识别为函数?

标签: javascriptclassoop

解决方案


this就是所谓的函数。在这种情况下,称为函数this的事件是指事件。

您要做的是在使用 is 作为参考之前绑定方法。现在this将引用该类的实例。

event_listener(){
  this.log_1 = this.log_1.bind(this)

  document.getElementById("cat_button").addEventListener("click", this.log_1);
}

推荐阅读