What are context and updater arguments in the React library?

Question

I was trying to understand the React through the React library, but couldn't understand what context and updater is, which is passed in to the Component.

Following was the code in the library.

function Component(props, context, updater) {
  this.props = props;
  this.context = context;
  this.refs = emptyObject;
  // We initialize the default updater but the real one gets injected by the
  // renderer.
  this.updater = updater || ReactNoopUpdateQueue;
}

What is the purpose of these things?

Answer 1

Context

Context was introduced to enable developers to pass props to components directly, rather than via the properties of every intermediary component by way of prop drilling (which can become overly cumbersome relatively quickly).

In some cases, you want to pass data through the component tree without having to pass the props down manually at every level. You can do this directly in React with the powerful “context” API.

---

Updater

updater is an object containing methods used to update the DOM.

This is evident in lines 61 and 79.

// Line 61: Enqueue setState.
this.updater.enqueueSetState(this, partialState, callback, 'setState') 

// Line 79: Force Update.
this.updater.enqueueForceUpdate(this, callback, 'forceUpdate') 

These methods are triggered using setState() and forceUpdate() respectively.