I see the following in the React codebase:
export type TypeOfWork = 0 | 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10;
What is it doing?
Source: https://github.com/facebook/react/blob/master/src/shared/ReactTypeOfWork.js
I see the following in the React codebase:
export type TypeOfWork = 0 | 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10;
What is it doing?
Source: https://github.com/facebook/react/blob/master/src/shared/ReactTypeOfWork.js
This is flow or typescript syntax.
It defines a custom type which can only be a number from 0 to 10.
export type TypeOfWork = 0 | 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10;
let x: TypeOfWork = 0;
x = 12; // <-- compiler would throw an error here
In this case an enum might be better (works only for typescript)
https://www.typescriptlang.org/docs/handbook/enums.html
export const enum TypeOfWork {
IndeterminateComponent = 0, // Before we know whether it is functional or class
FunctionalComponent = 1,
ClassComponent = 2,
HostRoot = 3, // Root of a host tree. Could be nested inside another node.
HostPortal = 4, // A subtree. Could be an entry point to a different renderer.
HostComponent = 5,
HostText = 6,
CoroutineComponent = 7,
CoroutineHandlerPhase = 8,
YieldComponent = 9,
Fragment = 10
};
Which would be minified way better as you can see in the compiled view