Question

我有一个名为Greeter的JavaScript类。在课堂上我有：

构造函数
文档点击事件处理程序
一个名为a

我想要的是我的文档点击事件处理程序来调用公共函数a。但我收到错误：＆＃34; 未捕获的ReferenceError：a未定义＆＃34;

这是我的代码：

var Greeter = (function () {

    function Greeter() {
    }

    Greeter.prototype.a = function () {
        alert('I am in a');
    };

    $(document).on( "click", function() {
        alert('I am in click event handler');
        a(); // <-- Why can't I call the public function a
    });

    return Greeter;
})();

var greeter = new Greeter();

这是demo。

Answer 1

a此处不是公共功能。在window对象上定义的函数是公共的，可以从任何地方访问（使用作用域链）。它是在Greeter的原型上定义的，因此，使用new Greeter在Greeter上创建的对象或从Greeter继承的子对象可以使用语法obj.a()来调用它。

您可以使用以下语法

调用该函数

Greeter.prototype.a();

或者，您也可以使用从greeter

创建的Greeter对象来访问它

greeter.a(); // instance of Greeter class. Has access to the function defined on prototype

我还建议移动在Greeter函数之外的原型和事件绑定上添加新函数的代码。

Updated Fiddle

var Greeter = (function() {
  function Greeter() {}

  return Greeter;
})();

Greeter.prototype.a = function() {
  alert('I am in a');
  // b();
};

$(document).on("click", function() {
  alert('I am in click event handler');
  Greeter.prototype.a();
});

var greeter = new Greeter();

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>

Answer 2

你最想要的东西（我猜这里）

var Greeter = (function () {

    function Greeter() {
        var _this = this;
        $(document).on( "click", function() {
             alert('I am in click event handler');
             _this.a(); // <-- Why can't I call the public function a
        });
     }

     Greeter.prototype.a = function () {
         alert('I am in a');
     };



     return Greeter;
})();

var greeter = new Greeter();

这样，只有在实例化时才会调用处理程序。它有一个真正的参考。

如何从JavaScript中的事件处理程序调用公共函数？

2 个答案: