第7章 React原理
7-1 React原理-考点串讲
- 函数式编程
- vdom 和 diff
- JSX 本质
- 合成事件
- setState batchUpdate
- 组件渲染课程
7-2 再次回顾不可变值
- 纯函数
- 不可变值
- SCU
7-3 vdom和diff是实现React的核心技术
- h函数
- vnode 数据结构
- patch函数
diff
- 只比较同一层级,不跨级比较
- tag不相同,则直接删掉重建,不再深度比较
- tag和key,两者相同。则认为是相同节点不再深度比较
7-4 JSX本质是什么
JSX等同于 Vue模板 Vue模板不是html JSX 也不是js
基本用法
JSX style
加载组件,组件 2个参数
JSX 事件
JSC list
7-5 说一下React的合成事件机制
为何要合成事件机制?
- 更好的兼容性和跨平台
- 栽在document ,减少内存消耗,避免频繁dom解绑
- 方便事件的统一管理(事务机制)
7-6 说一下React的batchUpdate机制
setState是异步还是同步?
- setState 无所谓同步还是异步
- 关键看是否命中 batchUppdate
- 判断 isBatchingUpdates
Y是异步,N是同步
setTimeout 触发异步,所以isBatchingUpdates 为 false
(自定义dom事件)
哪些能命中batchUpdate机制
- 生命周期(和他调用的函数)
- React中注册的事件(和他调用的函数)
- React 可以管理的入口
7-7 简述React事务机制
7-8 说一下React组件渲染和更新的过程
7-9 React-fiber如何优化性能
reconciliation (调解)
fiber(纤维)
idle(闲置)
RequestIdleCallback 简单的说,判断一帧有空闲时间,则去执行某个任务。目的是为了解决当任务需要长时间占用主进程,导致更高优先级任务(如动画或事件任务),无法及时响应,而带来的页面丢帧(卡死)情况。故RequestIdleCallback 定位处理的是: 不重要且不紧急的任务。
第8章 React面试真题演练
8-1 React真题演练-1-组件之间如何通讯
8-2 React真题演练-2-ajax应该放在哪个生命周期
异步与合并
纯函数(输入和返回的类型一样)
react中父子组件的生命周期
8-3 React真题演练-3-组件公共逻辑如何抽离
8-4 React真题演练-4-React常见性能优化方式
memo(备忘录)
Immutable.js出⾃Facebook,是最流⾏的不可变数据结构的实现之⼀。它实现了完全的持久化数据结构,通过使⽤像
tries这样的先进技术来实现结构共享。所有的更新操作都会返回新的值,但是在内部结构是共享的,来减少内存占⽤(和垃圾回收的失效)。