constructClassInstance() — react Function Reference

Architecture documentation for the constructClassInstance() function in ReactFiberClassComponent.js from the react codebase.

Function javascript BabelCompiler Validation calls 1 called by 2

Entity Profile

BabelCompiler→ Validation→ constructClassInstance() — react Function Reference

Dependency Diagram

graph TD
  0557b097_fe16_f352_4804_dd4ff4366808["constructClassInstance()"]
  3805476a_1924_0e35_fff7_6afad197a523["ReactFiberClassComponent.js"]
  0557b097_fe16_f352_4804_dd4ff4366808 -->|defined in| 3805476a_1924_0e35_fff7_6afad197a523
  9bea19b8_e307_63f1_e3b4_89c20a3fd20b["updateClassComponent()"]
  9bea19b8_e307_63f1_e3b4_89c20a3fd20b -->|calls| 0557b097_fe16_f352_4804_dd4ff4366808
  0516fb13_8886_d15c_4bfa_1bd5d35db45d["mountIncompleteClassComponent()"]
  0516fb13_8886_d15c_4bfa_1bd5d35db45d -->|calls| 0557b097_fe16_f352_4804_dd4ff4366808
  88d91075_df31_e6fc_5535_80030045f42a["setIsStrictModeForDevtools()"]
  0557b097_fe16_f352_4804_dd4ff4366808 -->|calls| 88d91075_df31_e6fc_5535_80030045f42a
  style 0557b097_fe16_f352_4804_dd4ff4366808 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

packages/react-reconciler/src/ReactFiberClassComponent.js lines 528–703

function constructClassInstance(
  workInProgress: Fiber,
  ctor: any,
  props: any,
): any {
  let isLegacyContextConsumer = false;
  let unmaskedContext = emptyContextObject;
  let context = emptyContextObject;
  const contextType = ctor.contextType;

  if (__DEV__) {
    if ('contextType' in ctor) {
      const isValid =
        // Allow null for conditional declaration
        contextType === null ||
        (contextType !== undefined &&
          contextType.$$typeof === REACT_CONTEXT_TYPE);

      if (!isValid && !didWarnAboutInvalidateContextType.has(ctor)) {
        didWarnAboutInvalidateContextType.add(ctor);

        let addendum = '';
        if (contextType === undefined) {
          addendum =
            ' However, it is set to undefined. ' +
            'This can be caused by a typo or by mixing up named and default imports. ' +
            'This can also happen due to a circular dependency, so ' +
            'try moving the createContext() call to a separate file.';
        } else if (typeof contextType !== 'object') {
          addendum = ' However, it is set to a ' + typeof contextType + '.';
        } else if (contextType.$$typeof === REACT_CONSUMER_TYPE) {
          addendum = ' Did you accidentally pass the Context.Consumer instead?';
        } else {
          addendum =
            ' However, it is set to an object with keys {' +
            Object.keys(contextType).join(', ') +
            '}.';
        }
        console.error(
          '%s defines an invalid contextType. ' +
            'contextType should point to the Context object returned by React.createContext().%s',
          getComponentNameFromType(ctor) || 'Component',
          addendum,
        );
      }
    }
  }

  if (typeof contextType === 'object' && contextType !== null) {
    context = readContext((contextType: any));
  } else if (!disableLegacyContext) {
    unmaskedContext = getUnmaskedContext(workInProgress, ctor, true);
    const contextTypes = ctor.contextTypes;
    isLegacyContextConsumer =
      contextTypes !== null && contextTypes !== undefined;
    context = isLegacyContextConsumer
      ? getMaskedContext(workInProgress, unmaskedContext)
      : emptyContextObject;
  }

  let instance = new ctor(props, context);
  // Instantiate twice to help detect side-effects.
  if (__DEV__) {
    if (workInProgress.mode & StrictLegacyMode) {
      setIsStrictModeForDevtools(true);
      try {
        instance = new ctor(props, context);
      } finally {
        setIsStrictModeForDevtools(false);
      }
    }
  }

  const state = (workInProgress.memoizedState =
    instance.state !== null && instance.state !== undefined
      ? instance.state
      : null);
  instance.updater = classComponentUpdater;
  workInProgress.stateNode = instance;
  // The instance needs access to the fiber so that it can schedule updates
  setInstance(instance, workInProgress);