1

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 rules」というポップアップが表示されます。

彼のサンプルは機能しません。試してみましMyObject.ClickHandler()たが、エラーが発生しました... (未定義のメソッド 'ClickHandler' を呼び出せません)

どうすればMyObject.ClickHandler()仕事をすることができますか?

4

2 に答える 2

4

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);

addEventListenerthisイベントリスナーが割り当てられたオブジェクトを参照します。スコープbindの変更についても参照してください。this

于 2012-05-22T19:25:18.877 に答える
2

編集: Zoiks、Lekenstein が頭に釘を打ちました。あなたがここで何をしようとしているのか、私には完全には理解できませんでした...


それは正確には「自己実行機能」ではありません。次のようにビルドした場合:

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

次に、それを自己実行機能と呼びます。

それが完了したら、実行MyObject.ClickHandler()してアラートを受け取ることができます。

于 2012-05-22T19:26:04.987 に答える