具有大量相互依赖事件的实体的设计模式

Question

所以我正在写一个小笔记应用程序。以下是他们更新状态/视图的各种实体和事件。

| Notebook              | Notes            | Status bar            |
|-----------------------|------------------|-----------------------|
| Note added            | Notebook changed | Notebook changed      |
| Note deleted          | Notebook deleted | Notebook deleted      |
| Note completed        | Notebook added   | Date changed          |
| Hours added / changed | Date changed     | Note added            |
| Date changed          |                  | Note deleted          |
|                       |                  | Note completed        |
|                       |                  | Hours added / changed |
|                       |                  | Date changed          |

我打算使用观察者模式的变体来处理各种实体之间的事件。

                                                     +---------------+
+--------------+                                     |               |
|              |                                     |   Notebook    |
|    Notes     |                                     |               |
|              |                                     +-------+-------+
+--------------+                                             |
               |              +--------------+               |
               |              |              |               |
               +-------------->  Mediator    <---------------+
                              |              |
                              +-------^------+
                                      |
                                      |
     +----------------+               |
     |                |               |
     |  Status bar    +---------------+
     |                |
     +----------------+

调解员将接收所有事件，然后将其传递给该事件的相应订阅者。

让我们举一个例子 - 用户更新笔记并将其标记为已完成，在这种情况下必须完成以下操作，

1. 笔记本中已完成的笔记数量应该更改。
2. 状态栏中已完成的备注数量应更改。

让我们看一下上面的例子，看看一些代码，它们展示了我正在尝试做的事情 -

中保

'use strict';

class Mediator {
  constructor () {
    this._list = {};
  }

  subscribe (eventName, cb) {
    if (!this._list[eventName]) {
      this._list[eventName] = [];
    }

    this._list[eventName].push(cb);
  };

  trigger (eventName, data) {
    let subscribers = this._list[eventName] || [];
    for (let i = 0, len = subscribers.length; i < len; ++i) {
      let currSubscriber = subscribers[i];
      if (Array.isArray(data)) {
        currSubscriber.apply(null, data);
      } else {
        currSubscriber(data);
      }
    }
  }
}

module.exports = Mediator;

笔记本

this.mediator.subscribe('evt.note.completed', this.noteCompleted);

状态栏

this.mediator.subscribe('evt.note.completed', this.noteCompleted);

注意

this.mediator.trigger('evt.note.completed', note); 

这是观察者模式的变体吗？有没有比这更好的模式来处理我的用例？

Answer 1

这实际上在某种程度上重新发明了flux architecture。

在磁通体系结构中，Notes，Notebook和Statusbar是接收事件的视图控制器（在此步骤中充当Controller）（或{{ 1}}）来自用户或Web API，将它们传播到Actions，它被称为Mediator。然后将事件调度到订阅的Dispatcher（类似于MVC架构中的Stores）。 Model相应地更新Stores，然后重新呈现绑定到state的视图控制器（充当Stores）。在更新他们的视图时，他们可能会或可能不会发送另一个View，然后再循环地再次转到Action。在React中，它是通用体系结构的一种实现，View-Controllers实现为组件。

下面是说明上述流程的图：