Lesson 19 of 2383%

(Progress persistence is disabled until Phase 9)

TypeScript
Advanced
25 min

Type Narrowing

Refine types inside conditions.

Learning Objectives

  • typeof and instanceof

Type Narrowing

Welcome to this lesson on Type Narrowing. TypeScript builds on JavaScript by adding static typing, and mastering type narrowing will help you build highly robust applications.

Explanation

TypeScript code is transformed into JavaScript via a compiler (or transpiler) before it runs in the browser. The types you write exist strictly at development time to help you catch errors early.

Code Examples

Here is how you might write this in TypeScript:

  if (typeof padding === "number") {
    return " ".repeat(padding) + input;
  }
  return padding + input;
}\n```

### Practical Example

To truly master this, try defining types for the data structures you use every day. It will instantly highlight edge cases you may have missed.

<Callout type="note">
**Note:** The BrowserCode Playground does not yet support native TypeScript execution. This feature is coming in a future phase!
</Callout>

### Try It Yourself

You can open the playground to see the code, but note that execution is currently restricted.

<TryItButton />

### Key Takeaways
- TypeScript catches errors before they happen.
- Types are erased when compiled to JavaScript.

Lesson Progress

Take QuizBuild a TypeScript Project