Page cover
📋

TypeScript Cheatsheet

TypeScript

TypeScript types, interfaces, generics, utility types, and type manipulation for type-safe JavaScript development

Basic Types

Primitive Types

Basic type annotations

let isDone: boolean = false;
let count: number = 42;
let username: string = "Alice";
let nothing: null = null;
let notDefined: undefined = undefined;

Arrays

Array type syntax variants

let numbers: number[] = [1, 2, 3];
let strings: Array<string> = ["a", "b"];
let mixed: (number | string)[] = [1, "two", 3];

Objects

Object type literals

let user: { name: string; age: number } = {
  name: "John",
  age: 30
};

// Optional properties
let config: { debug?: boolean } = {};

Interfaces

Basic Interface

Define object shape with interface

interface User {
  id: number;
  name: string;
  email: string;
  age?: number; // Optional property
  readonly created: Date; // Readonly property
}

const user: User = {
  id: 1,
  name: "Alice",
  email: "alice@example.com",
  created: new Date()
};

Extending Interfaces

Inherit properties from another interface

interface Person {
  name: string;
  age: number;
}

interface Employee extends Person {
  employeeId: number;
  department: string;
}

Function Interface

Define function signatures

interface SearchFunc {
  (source: string, substring: string): boolean;
}

const search: SearchFunc = (src, sub) => {
  return src.includes(sub);
};

Generics

Generic Function

Create reusable type-safe functions

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

const num = identity<number>(42);
const str = identity("hello"); // Type inference

Generic Interface

Flexible interfaces with generics

interface ApiResponse<T> {
  data: T;
  status: number;
  message: string;
}

const userResponse: ApiResponse<User> = {
  data: { id: 1, name: "John", email: "j@e.com", created: new Date() },
  status: 200,
  message: "Success"
};

Generic Constraints

Constrain generic types

interface Lengthwise {
  length: number;
}

function logLength<T extends Lengthwise>(arg: T): void {
  console.log(arg.length);
}

logLength("hello"); // OK
logLength([1, 2, 3]); // OK
// logLength(42); // Error: number doesn't have length

Utility Types

Partial<T>

Make all properties optional

interface User {
  name: string;
  age: number;
  email: string;
}

// All properties become optional
type PartialUser = Partial<User>;

const updateUser: PartialUser = {
  age: 31 // Only updating age is fine
};

Pick<T, K>

Select specific properties

type UserPreview = Pick<User, 'name' | 'email'>;

const preview: UserPreview = {
  name: "Alice",
  email: "alice@example.com"
  // age not required
};

Omit<T, K>

Exclude specific properties

type UserWithoutEmail = Omit<User, 'email'>;

const user: UserWithoutEmail = {
  name: "Bob",
  age: 25
  // email property is excluded
};

Record<K, T>

Create object type with specific key-value types

type UserRoles = Record<string, boolean>;

const roles: UserRoles = {
  admin: true,
  editor: false,
  viewer: true
};

Find this helpful?

Check out more cheatsheets and learning resources, or get in touch for personalized training.