8

私のjavascriptオブジェクトで、私は自分がこれを書いていることに気づきました：

this_object = this;

メンバー変数を外部関数に渡す唯一の方法のようです...

google.maps.event.addListener(this.marker, 'click', function() {
    this.info_window.setContent('Chicago marker');
    this.info_window.open(this.map,this.marker);
});

それは機能しません。オブジェクトをメンバー変数にコピーして、新しいオブジェクトを渡す必要があります（そしてすべてthisをに置き換えますthis_object）

これは醜い感じです。「より良い」または「よりクリーンな」方法はありますか、それともこれが私の唯一の選択肢ですか？

4

5 に答える 5

5

確かにもっと良い方法があります。thisこれには、特定のオブジェクトにすでにバインドされているコンテキストを持つ関数の作成が含まれます。

コンテキストがthis現在のオブジェクトを参照するようにするbind()には、関数のメソッドを呼び出し、必要なコンテキストをパラメーターとして渡します。

google.maps.event.addListener(this.marker, 'click', function() {
    this.info_window.setContent('Chicago marker');
    this.info_window.open(this.map,this.marker);
}.bind(this)); // <-- notice we're calling bind() on the function itself

これは現在ECMAScript標準の一部であり、ブラウザーがネイティブに実装していない場合は、自分で簡単に実装できます。

if (!Function.prototype.bind) {
    Function.prototype.bind = function () {
        var fn = this,
            args = Array.prototype.slice.call(arguments),
            object = args.shift();

        return function () {
            return fn.apply(
                object, args.concat(Array.prototype.slice.call(arguments))
            );
        };
    };
}

これに関連するSOに関するすべての質問と回答を参照してください。

于 2010-08-26T00:31:55.157 に答える
4

JavaScriptを扱う場合this、ローカル変数にの参照を格納することは実際にはかなり一般的なパターンvar myThing=this;です。関数は、スコープで定義されたローカル変数にアクセスできることを忘れないでください。含まれている関数で定義されているすべての変数にアクセスできます。

于 2010-08-26T00:03:02.903 に答える
1

このコードは、多くのライブラリやプロジェクトで非常に頻繁に見られます。

function someFunction() {
   var that = this;

   //....
}

たとえば、次の関数について考えてみます。

function container(param) {

    function dec() {
        if (secret > 0) {
            secret -= 1;
            return true;
        } else {
            return false;
        }
    }

    this.member = param;
    var secret = 3;
    var that = this;

    return function () {
        if (dec()) {
            return that.member + " " + secret;
        } else {
            return null;
        }
    };
}

var c = container("foo");
alert( c() ); // "foo 2";
alert( c() ); // "foo 1";
alert( c() ); // "foo 0";
alert( c() ); // null;

詳細はこちらをご覧ください。

于 2010-08-26T00:23:15.427 に答える
0

私は以前にパターンを見たことがあります（問題の変数が呼び出されています）ので、それは確かに、よりクリーンなソリューションを持っているだけではない一般的なjavascriptパターンであると思います。

于 2010-08-26T00:03:29.763 に答える
0

これがあなたが扱っているシナリオに役立つかどうかはわかりませんが、YUIのカスタムイベントユーティリティがこれとクロージャのスコープの問題でうまく機能することを発見しました。これはイベント駆動型モデルであり、考え方が少し異なりますが、少なくとも調査する価値があるかもしれません。

http://developer.yahoo.com/yui/event/#customevent

于 2010-08-26T00:17:25.753 に答える