Flux架构学习

Flux是Facebook提出的一个系统架构，用于推进应用中的数据单向流动。其在Flux的官方博客上介绍如下：Flux is the application architecture that Facebook uses for building client-side web applications.同过这段话我们可以知道Flux主要还是一个web前端的系统架构，当前主要也是结合React生态系统中的React，GraphQL一起使用。

架构模式

Flux模式的结构图如下：

相对于MVC架构：Flux中的Store包含了应用的所有数据，Dispatcher替换了原来的Controller，当Action触发时，决定了Store如何更新。当Store变化后，View同时被更新，还可以生成一个由Dispatcher处理的Action。这确保了数据在系统组件间单向流动。当系统有多个Store和View时，仍可视为只有一个Store和一个View，因为数据只朝一个方向流动，并且不同的Store和View之间不会直接影响彼此。

不同组件的介绍

下图来自于Flux的官方博客：

Dispatcher

Dispatcher是Flux的中心枢纽，管理着Flux应用中的所有数据流。它本质上是Store的回调注册。每个Store注册它自己并提供一个回调函数。当Dispatcher响应Action时，通过已注册的回调函数，将Action提供的数据负载发送给应用中的所有Store。当前一个Action还未处理完时，Dispatcher能够拒绝到来的Action，这样有助于确保数据层完成视图的更新。随着应用程序的增长，Dispatcher变得更加关键，因为它将管理Store之间的依赖，以特定的顺序调用注册的回调函数。Store可以声明等待其它Store完成更新后，再相应地更新自己⋯⋯

Stores

Store包含应用程序的状态和逻辑。它们的角色某种程度上与传统MVC中的Model类似，但它们管理很多对象的状态，它们不是某个对象的实例，也不是Backbone集合。Store不只是简单地管理ORM风格的对象集合，它还为应用程序中的特定领域（Domain）管理应用状态。

Actions

一个Action是由Dispatcher暴露出来的方法，这个方法承载着所需要的全部数据，同时该方法能触发Sotre的变化。

参考链接：
https://facebook.github.io/flux/docs/overview.html