JavaScript null vs undefined: What's the Difference?
17 August 2026
Understand the difference between null and undefined in JavaScript. Learn when to use each, and how to check properly in 2026.
Introduction to null and undefined
In JavaScript, null and undefined both represent empty values, but they mean different things. Undefined is the default value of a variable that has been declared but not assigned. Null is an intentional assignment to indicate 'no value' or 'nothing'. Think of undefined as JavaScript's way of saying 'I haven't set this yet', while null is you saying 'I'm deliberately clearing this'. This distinction matters in debugging, API design, and handling user input on UK-focused web projects.
Key Differences Between null and undefined
The most obvious difference is the type: typeof null returns 'object' (a longstanding bug), while typeof undefined returns 'undefined'. Undefined appears when accessing uninitialised variables, missing array elements, or non-existent object properties. Null must be explicitly assigned by you. In practice, undefined usually indicates an accidental absence, whereas null indicates a deliberate one. For instance, a UK e-commerce site might use null for a customer's optional middle name, and rely on undefined to catch missing required fields.
How to Check for null and undefined
Use strict equality (===) to distinguish between null and undefined: value === null or value === undefined. If you just need to know if a value is falsy (like when validating form inputs), you can use if (!value). However, beware of 0 and empty strings, which are also falsy. For reliable checks in modern JavaScript, consider Object.is(value, null) or Object.is(value, undefined) for exact matches. Many UK developers use optional chaining (?.) and nullish coalescing (??) to handle both gracefully.
Practical Examples in UK Web Development
Imagine you're building a user profile form for a UK-based service. A user might leave their 'county' field blank; you could set it to null to indicate 'not provided'. But if a field isn't even in the form data, it becomes undefined. When processing an API response, always check for undefined before assuming a property exists. For example, const postcode = data.postcode ?? 'N/A'; means if postcode is null or undefined, fall back to 'N/A'. This avoids nasty 'Cannot read properties of undefined' errors.
Common Pitfalls and Best Practices
Avoid using loose equality (==) because null == undefined is true, even though they're not the same. This often hides bugs. Best practice is to assign null explicitly when you want to clear a value, and let undefined happen naturally. When defining functions, consider default parameters: function greet(name = 'Guest') handles undefined but not null. For robustness, many UK teams standardise on using null for 'intentional absence' and reserve undefined for system-level states. Document your conventions to keep your codebase consistent.
FAQ
Loose equality (==) treats them as equal, but strict equality (===) does not. So null == undefined is true, but null === undefined is false. This is because they are different types and have distinct meanings. Always use strict equality to tell them apart.