Difference Between null and undefined in Typescript

1. Introduction

In TypeScript, understanding the difference between null and undefined is crucial for effective type management. null is an assignment value that indicates the intentional absence of any object value. It's used when you want to explicitly specify the absence of value. undefined, on the other hand, indicates that a variable has been declared but not assigned a value. It represents the unintentional absence of value.

2. Key Points

1. Intention: null is used intentionally, undefined often occurs unintentionally.

2. Use Case: null is for emptiness, undefined for uninitialized variables or properties.

3. Type Checking: TypeScript treats null and undefined differently unless the --strictNullChecks flag is off.

4. Default Value: Function parameters default to undefined when not provided.

3. Differences

Characteristic	Null	Undefined
Intention	Intentional absence of value	Variable declared but not assigned
Use Case	Emptiness	Uninitialized variables
Type Checking	Different from undefined	Different from null
Default Value	N/A	Function parameters not provided

4. Example

// Example of Null
let emptyValue: string | null = null;

// Example of Undefined
let uninitializedValue: string | undefined;

Output:

Null Output:
emptyValue has been explicitly set to null
Undefined Output:
uninitializedValue is declared but not initialized

Explanation:

1. emptyValue is explicitly set to null, indicating an intentional absence of value.

2. uninitializedValue is declared but left undefined, representing a variable that hasn't been initialized.

5. When to use?

- Use null when you need to indicate that a variable intentionally has no value, such as when resetting or clearing values.

- Use undefined to represent variables that have not been initialized yet or for optional function parameters that are not provided.