Question

我最近一直在使用事件驱动的javascript，并且想知道对于侦听自己事件的对象来说这是一个好/坏的事情，作为一种抽象和简化内部逻辑的方式。

请考虑以下事项：

function MyModule(options) {
    this.options = options;
    this.data    = {};

    this.setListeners();
    //...
}

MyModule.prototype = new EventEmitter;
MyModule.prototype.constructor = MyModule;

MyModule.prototype.updateBasket = function() {
    var self = this,
        url  = this.options.url;

    $.ajax(url)
        .done(function(data) {
            self.emit('basketupdate:success', data);
        })
        .fail(function(jqxhr, textStatus, err) {
            self.emit('basketupdate:error', err);
        })
        .complete(function() {
            self.emit('basketupdate:complete');
        });
};

MyModule.prototype.setListeners = function() {
    var self = this;

    this.on('basketupdate:success', function(data) {
        // ... do something on success
        self.data = data;
    });

    this.on('basketupdate:success', function(data) {
        // ... do something else on success
        console.dir(data);
    });

    this.on('basketupdate:error', function() {
        // ... do something to handle the error
    });
};

var module = new MyModule({
    url: '/path/to/request'
});

module.updateBasket();

带有ajax请求的简单模块。我可以很容易地将所有逻辑放在相应的回调中，甚至可以将回调映射到内部方法。但是我非常喜欢这种简化代码的方法。

以我未考虑的方式构建代码是否存在缺点或潜在问题。或者这会被视为一种反模式，其中的事件只是为了从其他地方收听？

Answer 1

你可以做到这一点，但它并没有真正有用。

此代码更易于阅读：

MyModule.prototype.updateBasket = function() {
    var self = this,
        url  = this.options.url;

    $.ajax(url)
        .done(this.done)
        .fail(this.fail)
        .complete(this.complete);
};

MyModule.prototype.done = function(data) {
    // Do something when done
};

MyModule.prototype.fail = function(data) {
    // Do something when request failed
};

MyModule.prototype.complete = function(data) {
    // Do something no matter what
};

你可以为你的方法提供更有意义的名字。

当您使用不想要链接在一起的不同对象时，事件发射器非常有用。

Javascript对象听自己的事件

1 个答案: