数据流
数据流，表明的是数据流向或数据传递。
一、单向数据流
1. 什么是单向数据流？
单向数据流（Unidirectional data flow）方式使用一个上传数据流和一个下传数据流进行双向数据通信，两个数据流之间相互独立。单向数据流指只能从一个方向来修改状态。
2. Vue 中的单向数据流
对于 Vue 来说，组件之间的数据传递具有单向数据流这样的特性。
- 父组件总是通过 props 向子组件传递数据；
- 所有的 prop 都使得其父子 prop 之间形成了一个单向下行绑定；
- 父级 prop 的更新会向下流动到子组件中，但是反过来则不行；
- 这样会防止从子组件意外改变父级组件的状态，从而导致你的应用的数据流向难以理解；
- 每次父级组件发生更新时，子组件中所有的 prop 都将会刷新为最新的值；
- 这意味着不应该在一个子组件内部改变 prop。如果这样做，Vue 会在浏览器的控制台中发出警告。
3. 单向数据流 - 优点
- 所有状态的改变可记录、可跟踪，源头易追溯；
- 所有的数据，具有唯一出口和入口，使得数据操作更直观更容易理解，可维护性强；
- 当数据变化时，页面会自动变化
- 当你需要修改状态，完全重新开始走一个修改的流程。这限制了状态修改的方式，让状态变得可预测，容易调试。
4. 单向数据流 - 缺点
- 页面渲染完成后，有新数据不能自动更新，需要手动整合新数据和模板重新渲染
- 代码量上升，数据流转过程变长，代码重复性变大
- 由于对应用状态独立管理的严格要求(单一的全局 store，如：Vuex)，在处理局部状态较多的场景时(如用户输入交互较多的“富表单型”应用)，会显得啰嗦及繁琐。
二、双向数据流
1. 什么是双向数据流？
在双向数据流中，Model（可以理解为状态的集合） 中可以修改自己或其他Model的状态， 用户的操作（如在输入框中输入内容）也可以修改状态。（双向数据流也可以叫双向数据绑定）
当我们在前端开发中采用 MV* 的模式时，M - model，指的是模型，也就是数据，V - view，指的是视图，也就是页面展现的部分。
将从服务器获取的数据进行“渲染”，展现到视图上。每当数据有变更时，我们会再次进行渲染，从而更新视图，使得视图与数据保持一致
页面也会通过用户的交互，产生状态、数据的变化，这个时候，我们则编写代码，将视图对数据的更新同步到数据
2. 双向数据流 - 优点
- 数据模型变化与更新，会自动同步到页面上，用户在页面的数据操作，也会自动同步到数据模型
- 无需进行和单向数据绑定的那些相关操作；
- 在表单交互较多的场景下，会简化大量业务无关的代码。
3. 双向数据流 - 缺点
- 无法追踪局部状态的变化；
- “暗箱操作”，增加了出错时 debug 的难度；
- 由于组件数据变化来源入口变得可能不止一个，数据流转方向易紊乱。
- 改变一个状态有可能会触发一连串的状态的变化，最后很难预测最终的状态是什么样的。使得代码变得很难调试
