Javascript 用于事件驱动体系结构的jQuery插件？

是否有任何事件驱动架构jQuery插件

步骤1：订阅
订阅服务器在中间订阅事件处理程序，并在回调方法中传递，以及他们正在侦听的事件的名称……/P> i、 e.两个绿色用户将监听p0事件。蓝色用户将监听p1事件

---

步骤2：p0事件由另一个组件激发到事件处理程序

将向事件处理程序触发一个p0事件

事件处理程序通知其订阅者该事件，调用订阅者在步骤1：订阅中订阅时指定的回调方法。

请注意，blue订户没有收到通知，因为它没有侦听p0事件

---

步骤3：p1事件由一个组件触发到事件处理程序

p1事件由另一个组件触发

与之前一样，只是现在蓝色订阅服务器通过其回调接收事件，而其他两个绿色订阅服务器不接收事件

我似乎找不到，但我猜他们只是在Javascript/jquery中将其称为其他名称

---

这个图案也有名字吗？因为它不仅仅是一个基本的发布者/订阅者，我认为它必须被称为其他的东西。

实际上有两个：

• 听（更快）：
• 拦截（更高级）：

---

您可能不需要插件来完成此操作。首先，DOM本身完全是事件驱动的。您可以使用事件委派来侦听根节点上的所有事件（jquerylive使用的一种技术）。为了处理可能与DOM无关的自定义事件，可以使用普通的旧JavaScript对象来完成这项工作。我写了一篇关于在MooTools中用一行代码创建中心事件调度器的文章

var EventBus = new Class({Implements: Events});

在jQuery中也很容易做到这一点。使用常规JavaScript对象作为所有事件的中心代理。任何客户端对象都可以发布和订阅此对象上的事件。见此相关报道

---

或者，如果您不关心公开jQuery，那么只需使用一个空对象并直接在jQuery包装的对象上调用

bind

和

trigger

var EventManager = {};

$(EventManager).bind("tabClicked", function() {
    // do something
});

$(EventManager).trigger("tabClicked");

$(EventManager).unbind("tabClicked");

包装器只是用来隐藏底层jQuery库，以便您可以在以后替换实现（如果需要）

---

这基本上就是or，一些很好的例子是由Ray Ryan在GWT社区推广的Cocoa的类模式，以及其他一些模式。
我将其用于发布/订阅服务。它不是一个jQuery插件，而是一个独立的JavaScript模块。您可以从SourceForge下载并使用。我喜欢分层主题命名和使用通配符标记订阅多个主题的支持。
这可以作为轻量级消息传递框架吗

function MyConstructor() {
    this.MessageQueues = {};

    this.PostMessage = function (Subject) {
        var Queue = this.MessageQueues[Subject];
        if (Queue) return function() {
                                        var i = Queue.length - 1;
                                        do Queue[i]();
                                        while (i--);
                                    }
        }

    this.Listen = function (Subject, Listener) {
        var Queue = this.MessageQueues[Subject] || [];
        (this.MessageQueues[Subject] = Queue).push(Listener);
    }
}

然后你可以做：

var myInstance = new MyConstructor();
myInstance.Listen("some message", callback());
myInstance.Listen("some other message", anotherCallback());
myInstance.Listen("some message", yesAnotherCallback());

后来：

myInstance.PostMessage("some message");

---

要分派队列
这可以使用虚拟jQuery节点作为分派器轻松完成：

var someModule = (function ($) {

    var dispatcher = $("<div>");

    function init () {
        _doSomething();
    }

    /**
        @private
    */
    function _doSomething () {
        dispatcher.triggerHandler("SOME_CUSTOM_EVENT", [{someEventProperty: 1337}]);
    }

    return {
        dispatcher: dispatcher,
        init: init
    }

}(jQuery));



var someOtherModule = (function ($) {

    function init () {
        someModule.dispatcher.bind("SOME_CUSTOM_EVENT", _handleSomeEvent)
    }

    /**
        @private
    */
    function _handleSomeEvent (e, extra) {
        console.log(extra.someEventProperty) //1337
    }

    return {
        init: init
    }

}(jQuery));

$(function () {
    someOtherModule.init();
    someModule.init();
})

var someModule=（函数（$）{
var dispatcher=$（“”）；
函数init（）{
_doSomething（）；
}
/**
@私人的
*/
函数_doSomething（）{
triggerHandler（“SOME_CUSTOM_事件”[{someEventProperty:1337}]）；
}
返回{
调度员：调度员，
init:init
}
}（jQuery））；
var someOtherModule=（函数（$）{
函数init（）{
someModule.dispatcher.bind（“SOME\u CUSTOM\u EVENT”，\u handleSomeEvent）
}
/**
@私人的
*/
函数_handleSomeEvent（e，额外）{
console.log（extra.someEventProperty）//1337
}
返回{
init:init
}
}（jQuery））；
$（函数（）{
someOtherModule.init（）；
someModule.init（）；
})

尽管Twitter不是jQuery插件，但它发布了一个名为的JavaScript框架，允许您创建基于组件的架构，通过事件进行通信
Flight是来自Twitter的一个轻量级、基于组件的JavaScript框架。与其他基于MVC模式的JavaScript框架不同，Flight将行为直接映射到DOM节点
Flight不知道请求是如何路由的，也不知道您决定使用哪个模板库。Flight强制严格分离关注点。飞行中的部件不会直接相互啮合
它们将自己的操作作为事件进行广播，订阅这些事件的组件可以基于它们采取操作。为了利用Flight，您需要ES5垫片和jQuery以及AMD装载机
最近的一项发展是“面向消息的JavaScript编程。灵感来自Spring集成”。它还支持通过WebSocket进行通信
msgs.js将《企业集成模式》一书中定义的词汇和模式应用于JavaScript，将面向消息的编程扩展到浏览器和/或服务器端JavaScript中。消息传递模式最初是为了集成松散耦合的不同系统而开发的，同样适用于单个应用程序进程中的松散耦合模块
[……]
测试环境：
• Node.js（0.6,0.8）
• 铬（稳定）
• Firefox（稳定、ESR，应在早期版本中工作）
• IE（6-10）
• Safari（5、6、iOS 4-6，应在早期版本中可用）
• Opera（11、12，应在早期版本中使用）

---

美好的谢谢你，长官！我在JS中寻找这种功能已经有很长时间了。实际上，JQuery需要插件来实现这一点让我很惊讶。通常我使用原型，这是默认的方法。等等，也许我接受这个答案有点太仓促了。我仔细查看了它们，发现这两个库似乎都没有一个中心组件，事件被触发，订阅者被通知

var someModule = (function ($) {

    var dispatcher = $("<div>");

    function init () {
        _doSomething();
    }

    /**
        @private
    */
    function _doSomething () {
        dispatcher.triggerHandler("SOME_CUSTOM_EVENT", [{someEventProperty: 1337}]);
    }

    return {
        dispatcher: dispatcher,
        init: init
    }

}(jQuery));



var someOtherModule = (function ($) {

    function init () {
        someModule.dispatcher.bind("SOME_CUSTOM_EVENT", _handleSomeEvent)
    }

    /**
        @private
    */
    function _handleSomeEvent (e, extra) {
        console.log(extra.someEventProperty) //1337
    }

    return {
        init: init
    }

}(jQuery));

$(function () {
    someOtherModule.init();
    someModule.init();
})