How to Check for Null in JavaScript

The JavaScript primitive type null represents an intentional absence of a value. It’s usually set on purpose to indicate that a variable has been declared but not yet assigned any value.

null is different from the similar primitive value undefined, which is an unintentional absence of any object value. That is because a variable that has been declared but not assigned any value is undefined, not null. 

Unfortunately, typeof returns “object” when called on a null value due to a historical bug in JavaScript that will never be fixed.

That means checking for null can’t be performed using typeof. Nullis also a falsy value. If it’s coerced to a boolean, it will evaluate as false. 

How to Check for Null in JavaScript (JS)

The simplest way to check for null is to know that null evaluates to false in conditionals or if coerced to a boolean value:

const maybeNull = null
if(maybeNull) { console.log("Not null") } else { console.log("Could be null") } // Could be null

for(let i = 0; null; i++) { console.log("Won't run") }

maybeNull ? console.log("truthy value") : console.log("Falsy value") // falsy value

Of course, that doesn’t differentiate null from the other falsy values.

Let’s explore using the double equality == and triple equality  === equality operators to check for null.

More on JavaScriptHow to Make JavaScript Sleep or Wait

Double Equality Operator ==

One way to check for null in JavaScript is to check if a value is loosely equal to null using the double equality == operator:

console.log("The 7 falsy values")
0 ? console.log("truthy") : console.log("falsy") // falsy
0n ? console.log("truthy") : console.log("falsy") // falsy
null ? console.log("truthy") : console.log("falsy") // falsy
undefined ? console.log("truthy") : console.log("falsy") // falsy
false ? console.log("truthy") : console.log("falsy") // falsy
NaN ? console.log("truthy") : console.log("falsy") // falsy
"" ? console.log("truthy") : console.log("falsy") // falsy

console.log("The value null")
console.log(null==0) // false
console.log(null==0n) // false
console.log(null==null) // true
console.log(null==undefined) // true
console.log(null==false) // false
console.log(null==NaN) // false
console.log(null=="") // false

null is only loosely equal to itself and undefined, not to the other falsy values shown.

This can be useful for checking for the absence of value: null and undefined both indicate an absence of value and are loosely equal, meaning they have the same value even though they are different types.

So, when programming to check if a variable has any value at all before trying to process it, you can use == null to check for either null or undefined.

Triple Equality Operator ===

To make sure we have exactly a null value excluding any undefined values, we can use the triple equality === operator, otherwise known as the strict equality operator:

console.log("The value null")
console.log(null===0) // false
console.log(null===0n) // false
console.log(null===null) // true
console.log(null===undefined) // false
console.log(null===false) // false
console.log(null===NaN) // false
console.log(null==="") // false

Generally, it’s a good idea to catch both null and undefined values, as both represent an absence of a value.

That means checking for null is one of the few times in JavaScript that using == is recommended. Otherwise, === is generally recommended.

Double Equality == vs Triple Equality === Operators 

Some JavaScript programmers prefer everything to be explicit, and there is nothing wrong with that.

Indeed, the code linter JSLint explicitly disallows == to prevent accidental bugs resulting from type coercion.

Another popular code linter, ESLint, has similar but more-configurable behavior around the use of == and ===.

That means that if you (or your linter) are in the habit of always using the strict equality operator ===, then you can check whether a value strictly equals null OR (||) strictly equals undefined, instead of using ==:

let maybeNull = null
// The following is equivalent to maybeNull == null or maybeNull == undefined:
console.log(maybeNull === undefined || maybeNull === null) // true
// Compare to the following:
console.log(maybeNull == null) // true
console.log(maybeNull == undefined) // true
console.log(maybeNull === null) // true
console.log(maybeNull === undefined) // false

maybeNull = undefined
console.log(maybeNull === undefined || maybeNull === null) // true
console.log(maybeNull == null) // true
console.log(maybeNull == undefined) // true
console.log(maybeNull === null) // false
console.log(maybeNull === undefined) // true

It’s more verbose than the == operator, but everyone who reads your code will clearly know that both null and undefined are being checked for.

When to Check for Null in JavaScript

The TypeError, “null is not an object”, can occur if the document object model (DOM) elements haven’t been created before loading the script. This can happen when the script is higher than the HTML on the page, which is interpreted from top-to-bottom.

While the solution would be to use an event listener that will notify us when the page is ready and then run the script, it’s also prudent to check if the DOM element is null before trying to access it.

How to Use Typeof to Check for Null in JavaScript

Another method of checking for null is to use the logical NOT ! operator. This works because empty objects are truthy and null is the only falsy object:

// The value null is the only falsy value with the typeof "object":
console.log(typeof null === "object" && !null) // true
console.log(typeof {} === "object" && !{}) // false

// This can be used to create a simple isNull() function:
const isNull = (value) => typeof value === "object" && !value
console.log(isNull(null)) // true

// To also check for an undeclared value, which will have typeof undefined, tweak the comparison slightly:
console.log(typeof maybeUndeclared === "undefined" || (typeof maybeUndeclared === "object" && !maybeUndeclared))
const isNullOrUndeclared = (value) => typeof value === "undefined" || (typeof value === "object" && !value))
const isNullOrUndeclared(undeclaredVariable) // true

// Otherwise, referencing an undeclared variable will throw a ReferenceError:
try { undeclaredVariable == null } catch(e) { console.log(e) } // ReferenceError: undeclaredVariable is not defined

Using typeof can be a helpful trick, because if a variable is undeclared, trying to reference it will throw a ReferenceError.

However, the typeof an undeclared value is "undefined", so using typeof can be a good way to check for null, undefined and undeclared variables.

// This will safely check a value to make sure it has been declared and assigned a value other than null or undefined:
console.log(typeof undeclaredVariable !== "undefined" &&
  (typeof undeclaredVariable !== "object" || !undeclaredVariable)) // false

// Compare to checking for null using ==, which will only work for declared variables:
try { undeclaredVariable == null } catch(e) { console.log(e) } // ReferenceError: undeclaredVariable is not defined
try { undeclaredVariable === null } catch(e) { console.log(e) } // ReferenceError: undeclaredVariable is not defined
try { undeclaredVariable === undefined } catch(e) { console.log(e) } // ReferenceError: undeclaredVariable is not defined

let declaredButUndefinedVariable
// Values that have been declared but not assigned a value will have the value undefined, which has a typeof undefined:
console.log(typeof declaredButUndefinedVariable !== "undefined" &&
  (typeof declaredButUndefinedVariable !== "object" || !declaredButUndefinedVariable)) // false

let stringVariable = "Here's Johnny!"
// If the variable has been both declared and assigned a value that is neither null or undefined, we will get true:
console.log(typeof stringVariable !== "undefined" &&
  (typeof stringVariable !== "object" || !stringVariable)) // true

// This can be used to create a function that will return false for undefined, undeclared, and null values:
const isNotNullNorUndefined = (value) => typeof value !== "undefined" && (typeof value !== "object" || !value)
console.log(isNotNullNorUndefined(stringVariable)) // true

How to Check for Null Using Object.is()

The JavaScript ES6 function Object.is() differs from the strict === and double == equality operators in how it checks for NaN and negative zero -0.

For null, the behavior of Object.is() is the same as ===:

let maybeNull = null
// The following is equivalent to maybeNull == null or maybeNull == undefined:
console.log(Object.is(maybeNull,undefined) || Object.is(maybeNull,null)) // true
// Compare to the following:
console.log(maybeNull == null) // true
console.log(maybeNull == undefined) // true
console.log(maybeNull === null) // true
console.log(Object.is(maybeNull,null)) // true
console.log(maybeNull === undefined) // false
console.log(Object.is(maybeNull,undefined)) // false

maybeNull = undefined
console.log(maybeNull === undefined || maybeNull === null) // true
console.log(maybeNull == null) // true
console.log(maybeNull == undefined) // true
console.log(maybeNull === null) // false
console.log(Object.is(maybeNull,null)) // false
console.log(maybeNull === undefined) // true
console.log(Object.is(maybeNull,undefined)) // true

That means that you will need to explicitly check for both null and undefined if you are using Object.is(), which is the helper method checking for changes in state under the hood in React.

More on JavaScriptHow to Use JSON.stringify() and JSON.parse() in JavaScript

Why Check for Null in JavaScript? 

Checking for null is a common task that every JavaScript developer has to perform at some point or another.

The typeof keyword returns "object" for null, so that means a little bit more effort is required. Comparisons can be made: null === null to check strictly for null or null == undefined to check loosely for either null or undefined.

The value null is falsy, but empty objects are truthy, so typeof maybeNull === "object" && !maybeNull is an easy way to check to see that a value is not null. Finally, to check if a value has been declared and assigned a value that is neither null nor undefined, use typeof:

typeof maybeUndeclared !== "undefined" && (typeof maybeUndeclared !== "object" || !maybeUndeclared)

Now go out there and check for null with confidence.