Question

有任何有趣的article警告JS问题。

然而，请注意＃2：

<input type="button" value="Gotcha!" id="MyButton" >
<script>
var MyObject = function () {
    this.alertMessage = "Javascript rules";
    this.ClickHandler = function() {
          alert(this.alertMessage );
      }
}();

</script>

注意最后()的自执行功能。但是，我很确定在执行this.xxx时会使用new MyObject()。他写道：

如果你致电MyObject.ClickHandler();，你会得到一个弹出“Javascript规则”。

他的样本不起作用。我试过MyObject.ClickHandler()并收到错误...（无法调用未定义的方法'ClickHandler'）

如何让MyObject.ClickHandler()工作？

Answer 1

您错过了new关键字。目前，this引用window，ClickHandler可通过window.ClickHandler获得。

使用new关键字时，会创建一个新对象，this关键字将引用该新创建的对象。这就是ClickHandler方法将添加到MyObject下面的原因：

var MyObject = new (function () {
    this.alertMessage = "Javascript rules";
    this.ClickHandler = function () {
        alert(this.alertMessage);
    };
})();

做类似的事情时要小心：

document.getElementById("MyButton")
    .addEventListener("click", MyObject.ClickHandler, false);

addEventListener使this引用分配了事件侦听器的对象。另请参阅bind更改this范围。

Answer 2

编辑： Zoiks，Lekensteyn击中头部。我不完全明白你打算在这里完成什么......

这不完全是一种“自动执行功能”。如果你像这样构建它：

(function(MyObject) {
    MyObject.alertMessage = "Javascript rules";
    MyObject.ClickHandler = function() {
        alert(this.alertMessage );
    }
})(window.MyObject = window.MyObject || {});

然后我称之为自动执行功能。

完成后，现在可以执行MyObject.ClickHandler()并获取警报。

这个JS怎么了？

2 个答案: