系统分析与设计HW10

描述软件架构与框架之间的区别与联系
- 软件架构：软件架构是一个系统的草图。软件架构描述的对象是直接构成系统的抽象组件。各个组件之间的连接则明确和相对细致地描述组件之间的通讯。在实现阶段，这些抽象组件被细化为实际的组件，比如具体某个类或者对象。在面向对象领域中，组件之间的连接通常用接口来实现。
- 框架：软件框架（Software framework），软件框架其实就是将代码放到一个我们看不到的容器中，规定架构。当我们使用的时候直接调用。其实就是某种应用的半成品，就是一组组件，供你选用完成你自己的系统。简单说就是使用别人搭好的舞台，你来做表演。而且，框架一般是成熟的，不断升级的软件。
- 区别：
  - 软件框架是一个软件产品，而软件架构不是软件产品；
  - 软件架构所呈现的是一个设计规约，而软件框架是程序代码；
  - 软件架构的首要目的大多是指导一个软件系统的实施和开发，而框架的首要目的是为了复用；
以你的项目为案例
- 绘制三层架构模型图，细致到分区
- 结合你程序的结构，从程序员角度说明三层架构给开发者带来的便利
  - 开发人员可以只关注整个结构中的其中某一层；
  - 可以很容易的用新的实现来替换原有层次的实现；
  - 可以降低层与层之间的依赖；
  - 有利于标准化；
  - 利于各层逻辑的复用；
  - 结构更加的明确；
  - 在后期维护的时候，极大地降低了维护成本和维护时间。
研究 VUE 与 Flux 状态管理的异同

关于Flux状态管理
- 状态集管理框架，由Facebook创建，专门用来构建前端框架结构的框架，便于维护，用于安全考虑，它分为4层：view视图层，action，dispatcher派发层，store仓库层
- redux是flux中的一个实现（不是所有的项目都适合redux）
redux的流程：view -> action -> store -> reducer（返回）-> store -> view 　　
关于VUE状态管理
- Vue 提供 vuex：Vuex 是一个专为 Vue.js应用程序开发的状态管理模式。它采用集中式存储管理应用的所有组件的状态，并以相应的规则保证状态以一种可预测的方式发生变化。
- vuex多个组件调用一个状态，将原来组建与组件之间的状态传递改成组件与仓库之间的传递
- vuex核心：
  - state：存放多个组件共享的状态（数据）
  - mutations：存放更改state里状态的方法，用于变更状态，是唯一一个更改状态的属性
  - getters：将state中某个状态进行过滤，然后获取新的状态，类似于vue中的computed
  - actions：用于调用事件动作，并传递给mutation
  - modules：主要用来拆分state

　　　　vueComnent -> (dispatch)Action -> （commit） -> Mutations ->（mutate）State -> （render）VueComponent

Flux与VUE状态管理的异：
- 两者的数据流的流程不同。Flux的流程是：View发起Action->Action传递到Dispatcher->Dispatcher将通知Store->Store的状态改变通知View进行改变，而VUE的流程是：用户组件的输入触发action调用->actions通过commit一个mutation对store实例的状态进行修改->store实例状态变化反过来又通过getters被组件获知。
- Flux不区分同步和异步更改，而Vuex区分， commit时同步更新, action是异步更新。
Flux与VUE状态管理的同：
- Flux最早提出作为对传统前端MVC的一种改进，vuex是redux的基础上进行改变，对仓库的管理更加明确。
- 都通过store来存储状态。