设计模式-观察者模式

观察者模式，它定义对象间的一种一对多的依赖关系，当一个对象的状态发生改变时，所有的依赖于他的对象都将得到通知。--这是Javascript设计模式对观察者模式的定义。

所谓观察者首先你必须有个信息中心，我们且叫他Watcher吧。这个Watcher的作用是统一处理发布信息、和订阅信息的。

image

这是一个简单的观察者类，它有两个方法：一个发布，一个订阅。和一个属性watchers，这个是存放发布的命令和回调的一个仓库。我们先来看看他的用法：

image image

我们实例化一个watcher，让这个watcher订阅一个'打豆豆'的行为，传入的回调函数会在控制台打印出'豆豆：我被人打了!'，然后我们再发布一个'打豆豆'的行为此时我们的回调函数就被执行了。接下来我们来一起完善这个观察者。

订阅。

首先我们要订阅一个行为好让之后发布的时候能准确触发这个行为发生之后的回调函数。

image

当watchers里面没有这个行为的时候，说明还没有人订阅过这个行为，所以把这个行为初始化一个数组，因为这个行为所触发的回调函数可能不只是一个。随后我们往这个数组里push进去一个我们订阅时传入的回调函数。接下来是发布。

---

注：为了更直观的看出this.watchers里的结构，我们在图3展示了出来。this.watchers是个对象，这个对象里面的key是我们订阅的行为，这个key是个数组，存放的是我们订阅的这个行为的所有回调函数。

---

发布。

我们发布的时候要把我们发布的行为传入进去，随后这个函数会找到相应行为下所有回调函数并执行

image

---

注：[].shift === Array.prototype.shift。这一句是取出arguments里的第一项，也就是我们传入的行为。

---

现在放一下函数运行图

image

好了我们这一个观察者就实现了。当然其实观察者模式并没有这么简单，我这里只是提供一个简单的思路来为我们以后写业务代码时能更好的组织代码结构。由于本人水平有限，这里就先抛个砖。