Question

虽然我发现大多数与Ember相关的指南和教程都非常注重使用Binding和Observers，但我也发现通过evented mixin有选择地使用事件/订阅者模式的能力很强。

所以在我被带走之前，或者开始偏爱另一种模式，接受他们各自有自己的目的：

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

现在，一个视图将使用Observer进行更新：

//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'));
    }
});

现在，虽然这个例子有利于观察者，但是可以使用模式，所以我的问题是：使用evented mixin的性能优缺点（如果有的话）是什么？使用观察者的性能优缺点（如果有的话）是什么？

Answer 1

使用evented mixin而不是使用观察者有什么性能优势和劣势（如果有的话）？

为清楚起见，Ember.Evented mixin与Ember.Observable mixin无法真正比较，因为它们提供不同的功能。

<强> Ember.Observable

此mixin提供属性和属性观察功能，是Ember对象模型的核心功能。属性和观察者允许一个对象观察另一个对象上属性的更改。这是模型，控制器和视图在Ember应用程序中相互通信的基本方法之一，因此您无法真正使用它，因为它位于从Ember.Object扩展的每个对象中。

<强> Ember.Evented

此mixin允许Ember对象订阅和发出事件。在需要某种自定义事件订阅体系结构的情况下使用此mixin。使用这种混合创建一个数据绑定机制并不是我认为的重点，因为数据绑定已经由开箱即用的观察者机制提供。

总而言之，这里的选择不是使用观察者mixin和evented mixin，而是两者（如果你实现后者）以优雅的方式。

希望这有帮助。

Emberjs Evented vs Observers

1 个答案: