顶层API
React
React.Children
React.Component
React.PureComponent
- React.PureComponent与React.Component很相似
- 两者的区别在于React.Component并未实现shouldComponentUpdate(),而React.PureComponent中以浅显对比props和state的方式来实现了该函数。
React.memo
有点类似vue的keep-alive
- React.memo为高阶函数
- 它与React.PureComponent非常相似
- 但只适用于函数组件,而不适用class组件
- 组件函数在给定相同props的情况下渲染相同的结果,此时将其包装在React.memo中调用,以此通过记忆组件渲染结果的方式来提高组件的性能
- 跳过渲染组件的操作并直接复用最近一次渲染的结果
React.Fragment
- React.Fragment组件能够在不额外创建DOM元素的情况下,让render()方法中返回多个元素。
- 也可以使用其简写语法<></>
React.profiler
React.StrictMode
React.Suspense
React.createContext
React.createElement
- 元素: 元素是构成React应用的最小砖块
- 元素描述了你在屏幕上想看到的内容
- 元素类型可以是标签名字符串(如‘div’、‘span’等),也可以是React组件类型(class组件或者函数组件),或是React fragment类型
- 与浏览器的DOM元素不同,React元素是创建开销极小的普通对象
- React DOM会复制更新DOM来与React元素保持一致
- JSX编写的代码会被转换成使用React.createElement()的形式
- 通俗理解: 有点像是JavaScript的文档片段(DocumentFragment)
React.createFactory
已废弃
React.cloneElement
- 以element元素为样板克隆并返回新的React元素
- 返回元素的props等于新的props和原始元素的props浅层合并后的结果
- 新的子元素将取代现有的子元素
- 原始元素的key和ref将被保留
- 通俗理解:有点像JavaScript构造函数继承的感觉
React.isValidElement
- 验证对象是否为React元素,返回值是true或false
React.createRef
React.forwardRef
React.lazy
- 定义一个动态动态加载的组件
- 有助于缩减bundle的体积,并延迟加载在初次使用时未用到的组件