6

JavaScript プロトタイプと継承を使用して大規模なアプリケーションを作成しました。しかし、コードを整理するのに苦労しています。たとえば、次のような多くの機能を持つクラス カルーセルがあります。

Carousel.prototype.next = function () {...}
Carousel.prototype.prev = function () {..}
Carousel.prototype.bindControls = function () {..}

コードを次のように整理したいと思います。

Carousel.prototype.controls = {
   next: function () { ... } , 
   prev: function() { ... },
   bindControls: function () { .. }
}

しかし、これでは「これ」の価値が失われてしまいます。グローバルインスタンスを使用して追跡できますが、たとえばクラスが継承されたときに問題が発生します別のファイルでは、親クラスをオーバーライドするためにこのようなものがあります

BigCarousel.prototype.next = function () {...}

私の継承は次のように行われます：

Function.prototype.inheritsFrom = function (parentClass) {
    if (parentClass.constructor === Function) {
        //Normal Inheritance
        this.prototype              = $.extend(this.prototype , new parentClass);
        this.prototype.constructor  = this;
        this.prototype.parent       = parentClass.prototype;
    }
    else {
        //Pure Virtual Inheritance
        this.prototype = $.extend(this.prototype, parentClass);
        this.prototype.constructor = this;
        this.prototype.parent = parentClass;
    }
    return this;
};

だから私はできる：

BigCarousel.inheritsFrom(Carousel)

「この」値を回避する方法を知っている人はいますか?

4

3 に答える 3

2

Controls独自のクラスを作成できます。

var Controls = function (controllable_object) {
    this.ref = controllable_object;
};
Controls.prototype.next = function () {
    this.ref.foo();
}
// ..

var Carousel = function () {
    this.controls = new Controls(this);
};
// ..

ただし、これにより実装をオーバーライドすることはできませんControls。依存性注入を追加すると、次のようになります。

var Controls = function (controllable_object) {
    this.ref = controllable_object;
};
Controls.prototype.next = function () {
    this.ref.foo();
}
// ..

var Carousel = function () {
        this.controllers = [];
    };
Carousel.prototype.addController = function (controller) {
        this.controllers.push(controller);
    };
// ..

var carousel = new Carousel();
carousel.addController(new Controls(carousel));
于 2013-04-08T16:21:13.100 に答える
1

私の継承は次のように行われます：

$.extend(this.prototype , new parentClass);

ああ。これは ( を使用した) 継承ではなくnew BigCarousel instanceof Carousel、単にプロパティをコピーするだけです。これで十分かもしれませんが、それならmixinと呼ぶべきです。また、for inheritance の使用は避けるnewべきです。

しかし、これでは「これ」の価値が失われてしまいます。どうすればそれを回避できますか?

ネストされたプロパティを持つ親オブジェクトを指すことは不可能thisです (毎回明示的に設定したくない場合に限ります)。次の 2 つの選択肢しかありません。

  • それを忘れて、メソッドに接頭辞 ( controlNext、controlBind、 …)を付けて整理します。

  • 各カルーセルに独自のcontrolsオブジェクトを与えます。継承のCarouselControls場合は、たとえばインスタンスにします。これは、これらのコントロールがカルーセルから完全に独立しており、どこにでも接続されているカルーセルにアクセスする必要がない場合に特に適しています。そうでない場合でも、親カルーセルへの参照をコンストラクターに渡すことができます。次に例を示します。

    this.controls = new CarouselControls(this);

    また、さまざまなカルーセルでコントロールをカスタマイズするには、CarouselControls同様にサブクラス化する必要がある場合があります。または、Controlsオブジェクトを一般的にさまざまなカルーセルに提供するように準備して、次のBigCarouselことができるようにします。

    Carousel.call(this); // make this a carousel
this.controls.activate({big: true, fast: false}); // or something
于 2013-04-08T16:31:35.243 に答える