javascript中的组件间通信

时间:2010-08-06 19:41:10

标签: javascript jquery javascript-events

我需要在Web应用程序中进行组件间通信,并且正在考虑实现此目的的不同方法。我有一些想法,但欢迎其他想法。

首先,一个快速而简单的例子。我在页面上有两个异步加载的独立组件。通过组件,我的意思是一大块HTML,它有一个与之关联的javascript对象,包括html中节点上基于jquery的行为。当用户与一个组件交互时,更改应该在另一个组件中进行,反之亦然。

这里要记住的关键是每个组件应该是一个独立的单元。它可以在应用程序的不同部分,甚至不同的应用程序中重复使用。所以它不知道页面上是否存在其他组件。

我目前对解决方案的想法涉及让组件侦听他们感兴趣的自定义事件以及在发生操作时发送自定义事件。因此,每个组件都会侦听由另一个组件触发的事件。

问题在于,由于异步加载,一个组件的加载时间可能比另一个组件要长。事件可能会很快发送并丢失。在某些情况下,这可能没问题,但在某些情况下,我需要确保组件发送的所有事件都被消耗掉。

所以这里有一些相关的问题:

  1. 触发事件后会发生什么?如果在触发时没有听众,它是否会消失?

  2. 有没有办法检测触发的偶数是消耗还是丢失?

  3. 每个组件有哪些好方法了解其他组件

  4. 是否有任何现有的开源JavaScript项目或jquery插件可以处理这些类型的事情?

  5. 关于问题#3,我认为每个组件都可以发出某种 register 事件,其中包括它侦听的事件类型以及它具有的组件列表注册。组件会监听这些注册事件。使用定时器的某种注册逻辑将用于确保在组件加载过程中正确的组件一起注册。注册完成后,组件就能发送正常事件。

4 个答案:

答案 0 :(得分:4)

消息排队确实是您正在寻找的。我相信你可以设想各种方案,包括监听自定义事件,接收消息,播放时间和顺序,节流,广播等的观察者对象。但在进入所有这些之前,请看一下这个jQuery {{3} }。可能是一个很好的起点。

答案 1 :(得分:1)

Web服务是一个很好的模型,可以参考这里。当您拥有用于云计算(或任何分布式计算平台)的互连Web服务时,它们通常会在它们之间实现某种消息队列或“总线”。

您可能会考虑创建一个处理“事件”的全局消息队列,并且可以将其发布给订阅者或保留它直到对其执行操作(通常称为作业)。

答案 2 :(得分:1)

我不确定这是否完全包含了您正在尝试做的事情,但听起来像JavaScriptMVC这样的开源项目可能对您有用。这个开源框架允许控制器处理事件委托并提供您正在寻找的一些分离。它还利用了jQuery。

该网站有点难以浏览(或至少找到很多具体信息),但介绍视频很有用(12分钟)。

希望这有帮助!祝你好运!

答案 3 :(得分:1)

有关事件管理的其他事项是来自Microsoft(RxJS)的Reactive Extensions for JavaScript。它与JavaScriptMVC中的控制器的行相同,您可以在Observable序列中注册事件,但是您可以使用类似LINQ的语法与它们进行交互。

Matthew Podwysocki有很多关于使用RxJS的好文章。这里有一些好帖子:

Introduction to RxJS(好介绍)
Error Handling Pt. 2以及其他许多帖子的链接

指向RxJS的某些hands on labs的链接。

希望这也有帮助!