系统分析与设计第八次作业(lesson 13)

系统分析与设计第八次作业(lesson 13)

---

1. 描述软件架构与框架之间的区别与联系

区别：

• 软件架构模式是特定领域常见问题的解决方案。
• 而框架是特定语言和技术的架构应用解决方案。

联系：

• 软件架构是框架的理论抽象
• 框架是软件架构在一种编程语言下的具体实现

---

2. 以你的项目为案例

a. 绘制三层架构模型图，细致到分区

b. 结合你程序的结构，从程序员角度说明三层架构给开发者带来的便利

• 每个层或包的职责是清晰的，模块化并可扩展的。系统分析的每个类会分明确的放置；
• 提供了隐式的程序复用准则；
• 每个层涉及的技术是明确的。这使得程序员可以通过快速培训上岗；
• 通过依赖估计项目变化产生的工作量；
• 开发次序和重要性是明确的。领域模型、基础模块（用户和基础数据的DTO和Service必须优先开发与测试），减少这些模块的错误，特别是领域模型设计失误，是项目成功的关键；
• 并行开发支持。利用前后端分离，实现并行开发

---

3. 研究 VUE 与 Flux 状态管理的异同

Flux 状态管理

React 本身只涉及UI层，如果搭建大型应用，必须搭配一个前端框架。即React + 前端框架才能基本满足需要。 Facebook官方使用的是 Flux 框架。React 标榜自己是 MVC 里面 V 的部分，那么 Flux 就相当于添加 M 和 C 的部分。使用 Flux 组织代码和安排内部逻辑，使得应用更易于开发和维护，它跟MVC 架构是同一类东西，但是更加简单和清晰。Flux 利用单向数据流的方式来组合React中的视图组件。

Flux将一个应用分成四个部分：

• View：视图层，React 组件，这一层可以看作 controller-views，作为视图同时响应用户交互
• Action（动作）：视图层发出的消息（比如mouseClick）
• Dispatcher（派发器）：用来接收Actions、执行回调函数，处理动作分发，维护 Store 之间的依赖关系
• Store（数据层）：数据和逻辑部分，用来存放应用的状态，一旦发生变动，就提醒Views要更新页面

在相对独立的组件中，Action -> Store -> View 的单向数据流能得到保证。

VUE 状态管理

Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式。它采用集中式存储管理应用的所有组件的状态，并以相应的规则保证状态以一种可预测的方式发生变化。

状态管理包含以下几部分：

• store：相当于一个容器，；它是响应式的在全局都可以使用它；一个应用里只能定义一个 store 容器。
• state：这里对象里面放了各种状态（变量）
• mutations：唯一用来修改状态的回调函数，但不支持异步操作
• actions：包含异步操作，提交 mutations 来修改状态
• getters：在组件内部获取 store 中状态的函数
• module：将 store 分割成不同的模块

完整的 Vuex 动作是这样的：
Components( 组件 )中 methods 里面一个方法 dispatch （调用）Actions，
Actions 然后 commit 对应的Mutations 只有 Mutations 可以操作 State 中的状态数据，状态一改变，组件中就重新渲染。

应用级的状态由store集中管理
修改状态的唯一方式是commit同步的mutation
异步逻辑放在action里

与 flux 对比，最大的区别是Vuex把action细分成了action和mutation，分别应对异步场景和同步场景，由store自身充当dispatcher（负责注册/分发action/(mutation)。即如果把 action 和 mutation 看作一层（Flux里的action），二者结构完全一致。