TypeScript

TypeScript Cheatsheet

TypeScript is a statically typed superset of JavaScript that adds type safety and better tooling to your codebase.

TypeScript is a statically typed superset of JavaScript that compiles to plain JavaScript. It adds type annotations, interfaces, and advanced type features to help catch errors during development and improve code maintainability.

NOTE: Tested using the latest version at time of writing, v5.x

Basic Types

Define types for primitives and common values.

let name: string = 'John';
let age: number = 30;
let isActive: boolean = true;
let data: null = null;
let value: undefined = undefined;

Arrays

Type arrays with bracket notation or generic syntax.

let numbers: number[] = [1, 2, 3];
let names: Array<string> = ['Alice', 'Bob'];

Objects & Interfaces

Define object shapes with interfaces.

interface User {
  name: string;
  age: number;
  email?: string; // optional
}

const user: User = {
  name: 'John',
  age: 30
};

Type Aliases

Create reusable type definitions.

type ID = string | number;
type Status = 'pending' | 'approved' | 'rejected';

Union Types

Combine multiple types with |.

let value: string | number;
value = 'hello';
value = 42;

Intersection Types

Combine types with &.

interface A { a: number; }
interface B { b: string; }
type C = A & B; // { a: number; b: string; }

Functions

Type function parameters and return values.

function greet(name: string): string {
  return `Hello, ${name}`;
}

const add = (a: number, b: number): number => a + b;

Optional & Default Parameters

Mark parameters as optional or provide defaults.

function createUser(name: string, age?: number) {
  return { name, age: age ?? 18 };
}

function greet(name: string = 'Guest') {
  return `Hello, ${name}`;
}

Generics

Create reusable, type-safe functions and classes.

function identity<T>(arg: T): T {
  return arg;
}

const result = identity<string>('hello');

Classes

Type classes with access modifiers.

class User {
  private name: string;
  public age: number;
  protected email: string;

  constructor(name: string, age: number) {
    this.name = name;
    this.age = age;
  }
}

Enums

Define sets of named constants.

enum Status {
  Pending = 'pending',
  Approved = 'approved',
  Rejected = 'rejected'
}

const currentStatus: Status = Status.Pending;

Type Assertions

Tell TypeScript the type when you know better.

const value = document.getElementById('input') as HTMLInputElement;
const data = <string>someValue;

Type Guards

Narrow types with runtime checks.

function isString(value: unknown): value is string {
  return typeof value === 'string';
}

if (isString(value)) {
  // value is string here
}

Utility Types

Built-in helpers for common type transformations.

type Partial<T> = { [P in keyof T]?: T[P] };
type Required<T> = { [P in keyof T]-?: T[P] };
type Pick<T, K extends keyof T> = { [P in K]: T[P] };
type Omit<T, K extends keyof T> = Pick<T, Exclude<keyof T, K>>;

Mapped Types

Transform types programmatically.

type Readonly<T> = {
  readonly [P in keyof T]: T[P];
};

Conditional Types

Create types based on conditions.

type NonNullable<T> = T extends null | undefined ? never : T;

Template Literal Types

Create string types from templates.

type EventName<T extends string> = `on${Capitalize<T>}`;
type ClickEvent = EventName<'click'>; // 'onClick'

Module Declarations

Type external modules and libraries.

declare module 'my-module' {
  export function doSomething(): void;
}

Namespaces

Organize code into logical groups.

namespace Utils {
  export function formatDate(date: Date): string {
    return date.toISOString();
  }
}

TypeScript helps catch errors early and makes codebases more maintainable. Start with basic types and gradually adopt advanced features.

For full documentation, see https://www.typescriptlang.org/docs

Promote your content

Reach over 400,000 developers and grow your brand.

Join our developer community

Hang out with over 4,500 developers and share your knowledge.