immy框架已服役半年，回首这段岁月，她确实给我们带来了非常重要的进步——不会再出现诸如修改css时“牵一发而动全身”的恐惧。模块化，强调了模块的独立、模块之间的隔离，然而，有时还是需要一些通信。现在就有一个问题比较挠头，抛出来探讨

问题：如何共享从服务端取回的数据

有些时候，多个模块都依赖于某一个api接口返回的数据（比如用户信息接口）。彼时，为了保证模块的独立性，提倡“各个模块如需要就自己去取”的做法。自然，这样的做法就会导致同一个页面会多次请求同一个接口，在性能上有一些损失。

现在，前端同学们有“共享”数据的倾向：即某一个模块去取，取回之后放到全局的data里，其他模块如需要就从这里来取。这样做可以避免多次访问同一接口，可是，有一个重要的问题必须得考虑：后者来取数据的时机。因为各个模块的加载、ajax请求都是异步的，假设A模块负责取数据（并放在全局），B模块从全局取数据来用。那么，B模块无法确切知道A模块何时把数据准备好。等待？等多久……不确定

一种确切的解决方法是：A模块准备好数据时主动调用B模块的方法，来应用数据。这无疑是引入了两个模块的硬关联，跟“模块隔离”的思想是相悖的。怎么办？

Event

使用Event机制，当A模块准备好数据后，提交一个 data-ready 的Event。那些关注此Event（预先已经注册过）的模块，就收到了明确的指示：现在数据ready了，你可以用了。

这种机制的一个进步是：

• 提交某Event的模块并不知道周围谁关心此Event，只管在自己干完活之后吼一嗓子；
• 关注某Event的模块也不知道是谁触发此Event，只管在那里等待即可。

如此，不存在显式的调用，比较解耦。

实现

大大们早已经实现并广泛应用此机制，在npm上每天的下载量都是10万，拿来用即可。

示意代码

// 全局有一个EventEmitter的单例
project.events = new EventEmitter();

// 模块A（提交Event）
some other logic...
$.ajax(..., {
    success: function(json) {
         project.data.userData = json.userData;
         project.events.emit('user.data.ready'); // 提交Event
    }
})

// 模块B（消费Event）
some other logic...
project.events.addEventListener('user.data.ready', function() {
    var user = project.data.userData;
    // use it
});

// 模块C（消费Event）
// 代码类模块B，按自己需要来应用数据

注：

• addEventListener必须在event.emit之前执行
• addEventListener有个别名: on（跟jquery的 $('...').on('click', ....) 的风格一致）。熟悉这套机制后，可以少写几个字符。
• emit时可以将数据作为参数带上，如不需将数据存到全局的话，可如此

OK, so long.