What is the difference between null and undefined in JavaScript?
Master System Design with Codemia
Enhance your system design skills with over 120 practice problems, detailed solutions, and hands-on exercises.
Introduction
null and undefined both represent missing values in JavaScript, but they mean different things and behave differently in comparisons and APIs. Confusion between them leads to subtle bugs in validation, serialization, and conditional logic. A clear convention around both values makes code easier to reason about.
Core Meaning of Each Value
undefined usually means a value has not been assigned. JavaScript produces it automatically in common situations such as reading a missing object property or calling a function without a return statement.
null is an intentional empty value. Developers set null to say a value is known and explicitly absent.
Use this mental model:
undefinedis often implicit absence.nullis explicit absence.
Equality and Type Behavior
Both values are falsy, but equality results differ depending on operator choice. Loose equality treats them as equal to each other, while strict equality keeps them distinct.
In production code, prefer strict equality. It avoids surprising coercions and communicates intent clearly.
Working with APIs and JSON
JSON can represent null, but it cannot represent undefined. During serialization, properties with undefined values are omitted, while null values are preserved.
This matters in API contracts. If your backend expects a field to be present with an empty value, send null, not undefined.
Practical Patterns for Safer Code
Use nullish coalescing when you want defaults only for nullish values. This avoids overriding valid falsy values such as zero or empty string.
For checks where either missing state is acceptable, compare once against null using loose equality in a very targeted way.
Use this intentionally and keep it localized so readers know it is deliberate.
Choosing a Team Convention
A practical team standard is:
- Use
undefinedfor internal optional values not set yet. - Use
nullin external contracts when explicit emptiness should be transmitted. - Use strict equality by default.
- Use
value == nullonly in helper utilities for combined missing checks.
This keeps behavior consistent across frontend code, Node services, and tests.
Interop with TypeScript and Validation Layers
In mixed JavaScript and TypeScript projects, nullish policy is easiest to maintain when runtime validation mirrors type definitions. For example, if an API field can be absent but not intentionally empty, treat undefined as allowed and reject null at the boundary. If explicit empty is allowed, include null in the contract and handle it intentionally.
This style keeps business behavior explicit and prevents ambiguous missing-value semantics from leaking into UI logic.
Debugging Strategy for Nullish Bugs
When nullish bugs appear, log both value and type at boundaries, then follow the value through transformations. Many issues come from one module defaulting to undefined while another expects null.
Keeping this debugging helper in test code can reduce time spent on hard-to-reproduce conditional failures.
Common Pitfalls
- Treating
nullandundefinedas fully interchangeable in all contexts. - Using loose equality everywhere and getting unexpected coercion behavior.
- Sending
undefinedin payloads and assuming backend receives the field. - Overwriting valid falsy values with defaults by using logical OR.
- Mixing conventions across modules and making API behavior inconsistent.
Summary
undefinedusually means not assigned.nullmeans explicitly empty.- Strict equality distinguishes them and should be default.
- JSON keeps
nullbut omitsundefinedproperties. - Establish one project convention and apply it consistently.

