1

Ember に関連して私が見つけたガイドとチュートリアルのほとんどは、Binding と Observers の使用に重点を置いていますが、evented mixinを介して Event/Subscriber パターンを選択的に使用することにも大きな力があることを発見しました。

ですから、夢中になる前に、またはあるパターンを別のパターンよりも優先し始める前に、それぞれに独自の目的があることを受け入れます。

//This is Object to hold the ajax request (and fire the event)
App.serverAPI = Em.Object.createWithMixins(Em.Evented, {
    responseData : '',
    init: function(){
        //Make the request on second from now
        Em.run.later(this, function(){
            this.request();
        }, 1000);
        this._super();
    },
    //The 'ajax' request function
    request: function(myData){
        var self = this;
        $.ajax({
            url:'/echo/json/',
            type: 'POST',
            data: {
                json: JSON.stringify({"0":"Value One", "1": "Value Two", "2": "Value Three"}),
                delay: 3
            },
            success: function(data){
                console.log("Request successful ", data);
                self.set('responseData', data);
                self.trigger('responseSuccess', data);
            }
        })
    }
});

これで、オブザーバーを使用して 1 つのビューが更新されます。

//This View gets it's value updated by Observing a changed value in an other object 
App.ObserverView = Em.View.extend({
    templateName: "observer",
    displayText: "Observer waiting...",
    responseDataHandler: function(){
        //Notice how we have to get the data here, where in a listener the data could be passed
        var data = App.serverAPI.get('responseData');
        //
        //...Run functions on the data
        //
        this.set('displayText', data[0]+", "+data[1]+", "+data[2]);
        console.log('Observer displayText', this.get('displayText'));
    }.observes('App.serverAPI.responseData')
});

サブスクライバーを使用して別のビューが更新されます。

//This View gets it's value updated by subscribing to an event in an other object 
App.SubscriberView = Em.View.extend({
    templateName: "subscriber",
    displayText: "Subscriber waiting...",
    init: function(){
        var self = this;
        App.serverAPI.on('responseSuccess', function(data){
            self.responseData(data);
        })
        this._super();
    },
    responseData: function(data){
        //
        //...Run functions on the data
        //
        this.set('displayText', data[0]+", "+data[1]+", "+data[2]);
        console.log('Subscriber displayText', this.get('displayText'));
    }
});

さて、この例はオブザーバーに有利ですが、どちらのパターンも使用できるので、私の質問は次のとおりです。オブザーバー?

4

1 に答える 1

3

オブザーバーを使用するのではなく、イベント化された mixin を使用することのパフォーマンスの利点と欠点 (ある場合) は何ですか?

明確にするために、ミックスインは異なる機能を提供するためEmber.Evented、ミックスインと実際に比較することはできません。Ember.Observable

Ember.Observable

この mixin は、Ember オブジェクト モデル のコア機能であるプロパティとプロパティ監視機能を提供します。プロパティとオブザーバーを使用すると、あるオブジェクトが別のオブジェクトのプロパティへの変更を監視できます。これは、Ember アプリケーションでモデル、コントローラー、およびビューが相互に通信する基本的な方法の 1 つですEmber.Object

Ember.Evented

この mixin により、Ember オブジェクトはサブスクライブしてイベントを発行できます。この mixin は、何らかのカスタム イベント サブスクライブ アーキテクチャが必要な場合に使用します。このミキシングを使用してデータ バインディング メカニズムを作成することは、ここでのポイントではないと思います。なぜなら、データ バインディングは、オブザーバー メカニズムによってすぐに提供されるからです。

結論として、ここでの選択は、observer mixin と evented mixin を使用するのではなく、両方 (後者を実装する場合) をエレガントな方法で使用することです。

お役に立てれば。

于 2013-08-04T11:58:50.690 に答える