null and undefined are not the same thing.
In a component API, treating them alike can silently delete a whole feature, with no error and no warning.
In our design system, the root prop says where a popup should render. It carries three intents:
- Nothing passed: inherit from the nearest PortalProvider.
- null passed: ignore the provider and use document.body.
- An element or a ref passed: use exactly that.
The obvious code would be root ?? portalRoot. It looks right, but ?? treats null and undefined the same way. Case 2 falls through to the fallback and the escape hatch is gone.
The final version compares against undefined explicitly:
if (root === undefined) return portalRoot;
return root;
What I take from this to any API:
- undefined means "I didn't say". It's what React hands you when a prop is omitted, and it's the only value that triggers a default parameter.
- null means "I said: nothing". It's a decision by the caller.
- If the difference matters, it needs one test per case. Ours has one for an omitted prop, one for an explicit null and one for an element.
A two-character operator almost removed an entire feature.
In your codebase, do null and undefined mean different things, or do you ban one of them?
