这是我参与「第四届青训营」笔记创作活动的第16天。
React历史与应用：
- 前端应用开发
- 移动原生应用开发
- 结合Electron，进行桌面应用开发
React应用生态
React优点对比
使用原生JS进行UI编程的痛点
- 状态更新，UI不会自动更新，需要手动地调用DOM进行状态更新。
- 欠缺基本的代码层面的封装和隔离，代码层面没有组件化。
- UI之间的数据依赖关系，需要手动维护，如果依赖链路长，则会遇到回调地狱。
React设计-响应式编程
- 状态更新，UI自动更新。
- 状态更新，UI不会自动更新，需要手动地调用DOM进行更新
- 前端代码组件化，可复用，可封装
- 欠缺基本的代码层面的封装和隔离，代码层面没有组件化
- 状态之间的互相依赖关系，只需声明即可
- UI之间的数据依赖关系，需要手动维护，如果依赖链路长，则会进入回调地狱。
组件化开发遵循的准则
- 组件是组件的组合/原子组件
- 组件内拥有状态，外部不可见
- 父组件可将状态传入组件内部
React设计-状态归属问题
思考：
- React是单向数据流还是双向数据流？
- 如何解决状态不合理上升的问题？
- 组件的状态改变后，如何更新DOM？
React设计-组件化
- 组件内部拥有私有状态State。
- 组件接受外部的Props状态提供复用性。
- 根据当前的State/Props，返回一个UI。
React（hooks）写法
React实现- Problem2
Virtual DOM 是一种用于和真实DOM同步，而在JS内容中维护的一个对象，它具有和DOM类似的树状结构，并和DOM可以建立一一对应的关系。
它赋予了 React 声明式的 API：您告诉 React 希望让 U| 是什么状态，React 就确保DOM 匹配该状态。这使您可以从属性操作、事件处理和手动DOM 更新这些在构建应用程序时必要的操作中解放出来。
