这是我参与「第五届青训营 」伴学笔记创作活动的第 6 天。
本篇笔记是对今天青训营的HTTP课程的归纳总结及个人感悟。
一、 React的历史与应用
- 前端应用开发历程例如Facebook、Instagram网页版
- 移动原生应用开发例如Instagram、Discord
- 结合Electron的桌面应用开发
二、 React的设计思路
A、UI编程痛点
- 状态更新:UI不会自动更新,需要手动
- 欠缺基本的代码层面的封装和隔离,代码层面没有组件化
- UI之间是数据依赖关系,需要手动维护
B、响应式编程
- 状态更新,UI自动更新
- 前端代码组件化,可复用,可封装
- 状态之间的互相依赖关系,只需声明即可
C、组件化
- 组件是组件的结合/原子组件
- 组件内拥有状态,外部不可见
- 父组件可将状态传入组件内部
三、 React(hooks)的写法与React的实现
A、React的实现-Problem 1&2
- JSX不符合JS标准语法
- 返回的JSX发生改变时,需要更新DOM
- State/Props更新时,需要重新触发render函数
B、React的实现-How to Diff
- 不同类型的元素→替换
- 同类型的DOM元素→更新
- 同类型的组件元素→递归
四、 React状态管理库
核心思想:将状态抽离到UI外部进行统一管理
常用的有Redux、Xstate、Mobx、Recoil