3

Class「厳密な使用」を使用するように適合され、SO postから取得されたJohn Resig の単純な OOPを使用しています。
すべての例で、次のClass.extendような使用法が見られます。

var MyObj = Class.extend({
    init:function(){},
    prop: "Property"
});

しかし、そのような方法で使用することには大きな欠点があることがわかりました。「プライベート」変数を持つことができないため、thislikeへの参照を保存できませんvar $this = this;。私は自分のケースの解決策を見つけましたが、今Class.extendでは次の方法で使用しています:

var MyObj = Class.extend(new function(){
    var $this = this;
    this.init = function(){};
    this.prop = "Property";
});

私の場合はすべてうまくいきますが、長期的に問題を引き起こす可能性があるものがあるかどうかを知りたいですか?
このようにして、私のアプリケーションはブラウザでより多くのメモリを消費しますか?
ニーズを実装するために必要な代替方法は何ですか?

注：イベントとコールバックを多用するため、$thisを保存する必要があるため、thisオブジェクトのすべてのメソッドとプロパティに簡単にアクセスできるように「元の」を参照したい.

編集: 要求どおり、これは私のコード例です:

(function () {
    "use strict";
    window.QuickPlay = Class.extend(new function () {
        var $this = this;

        this.init = function (initData) {
            $this.elementsToHide.push(initData.el);
            $(function () {
                playProcessStart();
                Sys.Application.add_load(function () {
                    $find("ctl00_ContentPlaceHolderMain_ctrlPlayPopup1").add_closed(function () { $this.setElementsVisibility(""); });
                });
                $this.setElementsVisibility("hidden");
            });
        };

        this.elementsToHide = [];

        this.setElementsVisibility = function (visibility) {
            $.each($this.elementsToHide, function (i) {
                $("#" + this).css("visibility", visibility);
            });
        };
    });
} ());
4

2 に答える 2

1

「プライベート」変数を持つことはできません

もちろんできます。（現在不要な）(function () { … } ());ラッパー、またはコンストラクター（initもの）のいずれかで。

new function () {

そのパターンは避けてください！コードが現在のように機能することが本当に必要な場合は、

(function () {
    "use strict";
    // Here's the place where you could put a private, static variable
    // for example `var elementsToHide = [];`
    var $this = {
        init: function (initData) {
            $this.elementsToHide.push(initData.el);
            $(function () {
                playProcessStart();
                Sys.Application.add_load(function () {
                    $find("ctl00_ContentPlaceHolderMain_ctrlPlayPopup1").add_closed(function () {
                        $this.setElementsVisibility("");
                    });
                });
                $this.setElementsVisibility("hidden");
            });
        },
        elementsToHide: [],
        setElementsVisibility: function (visibility) {
            $.each($this.elementsToHide, function (i) {
                $("#" + this).css("visibility", visibility);
            });
        }
    };
    window.QuickPlay = Class.extend($this);
}());

問題を引き起こす可能性のあるものがあるかどうかを知りたい

はい。elementsToHide複数のインスタンスはすべて同じ配列を参照するため、ほとんど機能しません。また、インスタンス メソッド (クラスのコンストラクターと静的要素のみ) を使用していないため、クラス パターンはまったく不要に思えます。代わりにモジュールを使用してください。単一のインスタンス (およびクラス) が必要な場合、コードは次のようになります。

"use strict";

window.QuickPlay = Class.extend({
    init: function (initData) {
        var $this = this;
        this.elementsToHide = [];
        $(function () {
            playProcessStart();
            $this.elementsToHide.push(document.getElementById(initData.el));
            Sys.Application.add_load(function () {
                $find("ctl00_ContentPlaceHolderMain_ctrlPlayPopup1").add_closed(function () {
                    $this.setElementsVisibility("");
                });
            });
            $this.setElementsVisibility("hidden");
        });
    },
    setElementsVisibility: function (visibility) {
        $(this.elementsToHide).css("visibility", visibility);
    }
});
于 2013-07-25T21:14:04.343 に答える