Strict null checks and safety in Typescript - Deep Dive

Overview - Strict null checks and safety

What is it?

Strict null checks is a TypeScript feature that helps catch errors where a value might be null or undefined. It forces you to check if a value exists before using it, preventing unexpected crashes. This makes your code safer and more predictable by avoiding mistakes with missing or empty values.

Why it matters

Without strict null checks, programs can crash or behave unpredictably when they try to use values that are missing or empty. This can cause bugs that are hard to find and fix. Strict null checks help catch these problems early, making software more reliable and easier to maintain.

Where it fits

Before learning strict null checks, you should understand basic TypeScript types and how variables can hold different values. After this, you can learn about advanced type narrowing, optional chaining, and how to write safer asynchronous code.

Mental Model

Core Idea

Strict null checks make you handle missing or empty values explicitly so your code never surprises you with unexpected crashes.

Think of it like...

It's like always checking if a door is locked before you try to open it, so you don't get stuck or hurt yourself.

Value
 ├─ Not null/undefined → Safe to use
 └─ Null or undefined → Must check before use

Build-Up - 7 Steps

1

Foundation

Understanding null and undefined

Concept: Learn what null and undefined mean in TypeScript and how they represent missing values.

In TypeScript, null means a variable explicitly has no value. Undefined means a variable has not been assigned any value yet. Both represent absence but are different. For example: let a: string | null = null; // a has no value let b: string | undefined; // b is undefined because not assigned Without checks, using these can cause errors.

Result

You know the difference between null and undefined and why they matter.

Understanding these two absence types is key to knowing why strict checks are needed.

2

Foundation

Default behavior without strict null checks

Concept: See how TypeScript behaves when strict null checks are off and why it can be risky.

By default, TypeScript allows null and undefined to be assigned to any type. For example: let name: string = null; // Allowed without strict checks This means you can accidentally use null where a string is expected, causing runtime errors.

Result

You realize that without strict checks, TypeScript won't warn you about null mistakes.

Knowing the default behavior shows why stricter rules improve safety.

3

Intermediate

Enabling strict null checks

🤔Before reading on: do you think enabling strict null checks will allow null to be assigned to any type? Commit to your answer.

Concept: Learn how to turn on strict null checks and what changes in type checking.

In your tsconfig.json file, set "strictNullChecks": true. This tells TypeScript to treat null and undefined as separate types that must be handled explicitly. Example: let name: string = null; // Error now let name2: string | null = null; // Allowed You must check if name2 is null before using it.

Result

TypeScript forces you to handle null and undefined explicitly.

Understanding this setting is the foundation for writing safer code with fewer surprises.

4

Intermediate

Type narrowing with null checks

🤔Before reading on: do you think TypeScript automatically knows a variable is not null after an if check? Commit to your answer.

Concept: Learn how TypeScript narrows types after you check for null or undefined.

When you check a variable against null or undefined, TypeScript understands it can't be null inside that block. Example: function greet(name: string | null) { if (name !== null) { console.log(name.toUpperCase()); // Safe here } } TypeScript knows name is a string inside the if block.

Result

You can safely use variables after checking for null or undefined.

Knowing how type narrowing works helps you write clean, safe code without extra checks.

5

Intermediate

Using optional chaining and nullish coalescing

🤔Before reading on: do you think optional chaining can replace all null checks? Commit to your answer.

Concept: Learn modern syntax to handle null or undefined values more easily.

Optional chaining (?.) lets you safely access properties or call functions only if the value exists. Example: let length = user?.name?.length; Nullish coalescing (??) provides a default value if something is null or undefined. Example: let displayName = user.name ?? "Guest"; These help reduce verbose null checks.

Result

You can write shorter, safer code when dealing with optional values.

Understanding these operators makes null safety easier and your code cleaner.

6

Advanced

Handling strict null checks in complex types

🤔Before reading on: do you think arrays or objects automatically handle null safety with strict checks? Commit to your answer.

Concept: Learn how strict null checks affect arrays, objects, and function returns.

When types include null or undefined, you must handle them in all places. Example: let arr: (string | null)[] = ["a", null]; You must check each element before using it. Functions returning possibly null values require checks too: function findUser(): User | null { return null; } let user = findUser(); if (user) { // safe to use user } This prevents runtime errors in complex data.

Result

You know how to apply null safety in real-world data structures.

Handling null in complex types prevents subtle bugs in larger applications.

7

Expert

Strict null checks and type system internals

🤔Before reading on: do you think strict null checks change how TypeScript compiles code or just how it checks types? Commit to your answer.

Concept: Understand how strict null checks affect TypeScript's type system and compilation.

Strict null checks only affect the type checking phase, not the generated JavaScript code. TypeScript uses control flow analysis to track variable states and narrow types. This means at runtime, no extra checks are added, but during development, errors are caught early. Also, strict null checks improve compatibility with strict mode in JavaScript and help tools like linters and IDEs provide better feedback.

Result

You understand the internal role of strict null checks in development safety.

Knowing this prevents confusion about runtime behavior and highlights the power of static analysis.

Under the Hood

TypeScript's compiler analyzes your code's control flow to track where variables can be null or undefined. When strict null checks are enabled, it treats null and undefined as distinct types that must be explicitly handled. It narrows types inside conditional blocks by removing null and undefined from the possible types when checks are made. This happens only at compile time; the emitted JavaScript does not include these checks.

Why designed this way?

Strict null checks were introduced to solve the common problem of runtime errors caused by null or undefined values. Before, TypeScript allowed these values anywhere, leading to bugs. The design balances safety and developer experience by enforcing checks during development without adding runtime overhead. Alternatives like runtime checks were rejected because they slow down code and complicate debugging.

Code
  ↓
TypeScript Compiler
  ├─ Control Flow Analysis
  │    ├─ Tracks variable states
  │    └─ Narrows types after checks
  ├─ Type Checking
  │    ├─ Flags null/undefined misuse
  │    └─ Enforces explicit handling
  ↓
JavaScript Output (no null checks added)

Myth Busters - 4 Common Misconceptions

Quick: Does enabling strict null checks add extra code to check null at runtime? Commit yes or no.

Common Belief: Strict null checks add runtime checks to prevent null errors.

Reality: Strict null checks only affect compile-time type checking; no extra runtime code is added.

Why it matters: Believing this can confuse developers about performance and debugging, leading to unnecessary runtime checks.

Quick: Can you assign null to a variable typed as string when strict null checks are on? Commit yes or no.

Common Belief: You can assign null to any type even with strict null checks enabled.

Reality: With strict null checks, null and undefined must be explicitly included in the type to be assigned.

Why it matters: Ignoring this causes type errors and confusion about why assignments fail.

Quick: Does optional chaining completely replace the need for null checks? Commit yes or no.

Common Belief: Optional chaining means you never need to check for null or undefined again.

Reality: Optional chaining helps access properties safely but does not replace all null checks, especially when you need to handle missing values explicitly.

Why it matters: Overusing optional chaining can hide logic errors or cause unexpected undefined values.

Quick: Does strict null checks guarantee no runtime null errors? Commit yes or no.

Common Belief: Strict null checks guarantee your program will never crash due to null or undefined.

Reality: Strict null checks reduce errors but cannot guarantee runtime safety if you use any or bypass checks.

Why it matters: Overconfidence can lead to ignoring other safety practices and cause bugs.

Expert Zone

1

Strict null checks interact subtly with union and intersection types, requiring careful type design to avoid overly complex checks.

2

TypeScript's control flow analysis can sometimes be too conservative or miss narrowing in complex code, requiring manual type assertions.

3

Enabling strict null checks improves compatibility with future JavaScript features like optional chaining and nullish coalescing, making code more future-proof.

When NOT to use

Strict null checks may be too strict for legacy codebases or quick prototypes where null safety is less critical. In such cases, using non-strict mode or gradual typing with explicit any types might be preferred temporarily.

Production Patterns

In production, strict null checks are combined with linting rules and code reviews to enforce null safety. Developers use patterns like guard clauses, exhaustive checks, and utility types (e.g., NonNullable) to write robust code. Optional chaining and nullish coalescing are widely used for concise null handling.

Connections

Optional chaining and nullish coalescing

Builds-on

Understanding strict null checks helps you use optional chaining and nullish coalescing effectively to write safer and cleaner code.

Static type checking

Same pattern

Strict null checks are a specific example of static type checking that prevents errors before running code, improving overall software quality.

Safety checks in aviation

Similar principle

Just like pilots follow strict safety checklists to avoid accidents, strict null checks enforce careful handling of uncertain values to prevent software crashes.

Common Pitfalls

#1 Ignoring null checks and assuming values are always present.

Wrong approach:

function printLength(name: string | null) {
console.log(name.length); // Error if name is null
}

Correct approach:

function printLength(name: string | null) {
if (name !== null) {
console.log(name.length);
}
}

Root cause:

Not understanding that variables can be null and must be checked before use.

#2 Disabling strict null checks to avoid fixing errors.

Wrong approach:

// tsconfig.json
{
"strictNullChecks": false
}

Correct approach:

// tsconfig.json
{
"strictNullChecks": true
}

Root cause:

Avoiding the effort to handle null safety leads to more bugs later.

#3 Overusing non-null assertion operator (!) without checks.

Wrong approach:

let length = name!.length; // Assumes name is never null, can crash

Correct approach:

if (name !== null) {
let length = name.length;
}

Root cause:

Misunderstanding that ! only tells TypeScript to ignore null but does not prevent runtime errors.

Key Takeaways

Strict null checks force you to handle missing values explicitly, making your code safer and more predictable.

Enabling strict null checks changes how TypeScript treats null and undefined, requiring explicit checks or union types.

Type narrowing after null checks lets you safely use variables without extra code.

Optional chaining and nullish coalescing are powerful tools that complement strict null checks for cleaner code.

Strict null checks improve development safety without adding runtime overhead, but they do not guarantee error-free programs alone.