介绍React.memo之前，先了解一下React.Component和React.PureComponent。React.ComponentReact.Component是基于ES6 class的React组件。React允许定义一个class或者function作为组件，那么定义一个组件类，就需要继承React.Component.例如：class Welcome extends React.Component { render() { return <h1>Hello, {this.props.name}</h1>; }}注意：继承React.Component的React组件类中，render()为必须方法，其他都为可选。React.PureComponentReact.PureComponent 和 React.Component类似，都是定义一个组件类。不同是React.Component没有实现shouldComponentUpdate()，而 React.PureComponent通过props和state的浅比较实现了。如果组件的props和state相同时，render的内容也一致，那么就可以使用React.PureComponent了,这样可以提高组件的性能。例如：class Welcome extends React.PureComponent { render() { return <h1>Hello, {this.props.name}</h1>; }}当props和state中有复杂数据结果时，不好使用PureComponent。React.memoReact.memo是一个高阶组件，类似于React.PureComponent，不同于React.memo是function组件，React.PureComponent是class组件。示例：const MyComponent = React.memo(props => { /* render using props / return ( );});这种方式依然是一种对象的浅比较，有复杂对象时无法render。在React.memo中可以自定义其比较方法的实现。例如：function MyComponent(props) { / render using props /}function areEqual(prevProps, nextProps) { / return true if passing nextProps to render would return the same result as passing prevProps to render, otherwise return false */}export default React.memo(MyComponent, areEqual);该方法在V16.6.0才支持推荐阅读《React 手稿》