TypeScript null and undefined

Note: If you're new to TypeScript, check our Getting Started with TypeScript tutorial first.

TypeScript undefined

In TypeScript, if a variable is declared without a value, its type is implicitly undefined. For example,

let userName: string;
console.log(userName); // undefined
console.log(typeof userName);

userName = "Felix";
console.log(typeof userName);

As you can see, we've declared a string variable userName without initializing its value. As a result, TypeScript assigns both its value and type as undefined.

But once we assign the value "Felix" to it, the variable type is now string.

let userName: string | undefined = "Felix";
userName = undefined;
console.log(userName); // undefined

TypeScript null

null in TypeScript represents an intentional absence of any object value:

let num: number | null = null;
console.log(typeof num);  // object
console.log(num);  // null

Here, we've assigned null to the num variable. But notice that typeof num gives object as output.

We'll learn why this is later in the tutorial.

Note: TypeScript distinguishes between null and undefined, and with --strictNullChecks, you must explicitly include null or undefined in the type.

False Values

Both null and undefined are falsy in TypeScript (just like JavaScript):

if (null || undefined) {
    console.log("true");
}
else {
    console.log("false");
}

Output

error: This kind of expression is always falsy.

Here, TypeScript gives a compile-time error because if (null || undefined) is always falsy.

So, it's a logical error to use an if...else statement to check for an expression that's always falsy, and TypeScript doesn't allow that.

null and undefined with Boolean()

null and undefined also evaluate to false with Boolean():

console.log(Boolean(undefined)); // false
console.log(Boolean(null)); // false

TypeScript typeof: null and undefined

const a = null;
console.log(typeof a); // "object"

let b: undefined;
console.log(typeof b); // "undefined"

Same behavior as JavaScript: typeof null === "object".

This is a long-standing bug in JavaScript that hasn't been fixed for fear of breaking old JavaScript code.

In reality, null is not an object but is actually a primitive value.

TypeScript Default Values: null vs undefined

When passing undefined to a function parameter with a default value, the default is used:

function test(x: number = 10) {
    console.log(x);
}

test(undefined); // 10

However, when you pass null to a default parameter function, the function takes the null as a value. For example,

function test(x: number = 10) {
    console.log(x);
}

test(null); // null

Comparing null and undefined

Using the Equal To Operator ==

console.log(null == undefined);  // true

Using the Strict Equal To Operator ===

console.log(null === undefined);  // false

Also Read:

• TypeScript Data Types