基础
类组件与函数组件的区别?
- 函数组件没有生命周期,没有this,没有状态
- 类组件必须继承React.component,必须实现render函数,render方法必须返回一个JSX元素。
setState和useState状态是同步的还是异步的
react的事件创建、合成事件方式
react事件是绑定在document上的 原生事件是绑定在dom上的
react在哪捕获错误
useEffect与useLayoutEffect的区别
两者都是调用mountEffectImpl,都是用于处理副作用。 副作用:应用程序中发生的与UI渲染不相关的任何事情。例如:HTTP请求,浏览器内存中存储数据,设置时间函数等。 useEffect是异步执行的,useLayoutEffect是同步执行的,【会在所有的DOM变更之后同步调用,主要用于处理DOM操作,调整样式等】会阻塞浏览器更新渲染。
useLayouteffect使用场景
- 添加平滑滚动
- 动画元素
- 自动对焦输入框
React触发状态更新的几种方式
- ReactDOM.render
- this.setState(this.setState内调用this.updater.enqueusSetState)
- this.forceUpdate(tag赋值ForceUpdate)
- useState
- useReducer
React18--新特性
自动批处理
批处理:将多次state更新合并到一次重新渲染中做的处理
⚠️:React只会对发生在浏览器事件中的state变更进行批处理(点击事件,键盘事件等)
react18之前,React的批处理只会发生在原生事件内,对于promise ,setTimeout,利用JS添加的原生事件处理函数等,都不会被React进行默认的批处理。
React18 从createRoot开始,所有的更新都会自动的进行批处理。
使用ReactDOM.flushSync()可以选择性的跳过批处理(少用)