Skip to content

03.PureComponent源码实现

代码演化见视频,这里只呈现相关代码:

react.js:

js
import { REACT_ELEMENT, REACT_FORWARD_REF, toVNode, shallowEqual } from './utils' ///

class PureComponent extends Component {
    shouldComponentUpdate(nextProps, nextState) { ///
        return !shallowEqual(this.props, nextProps) || !shallowEqual(this.state, nextState)
    }
}

const React = {
    createElement,
    Component,
    createRef,
    forwardRef,
    PureComponent ///
}

utils.js

js

  export const shallowEqual = (obj1, obj2) => {
    if (obj1 === obj2) {
      return true;
    }
    if (getType(obj1) !== 'object' || getType(obj2) !== 'object') {
      return false;
    }
    let keys1 = Object.keys(obj1);
    let keys2 = Object.keys(obj2);
    if (keys1.length !== keys2.length) {
      return false;
    }
    for (let key of keys1) {
      if (!obj2.hasOwnProperty(key) || obj1[key] !== obj2[key]) {
        return false;
      }
    }
    return true;
  }

基于 VitePress 构建