Bookmark this page. Use Ctrl+F (or Cmd+F on Mac) to find what you need. This cheat sheet covers modern JavaScript (ES6+) and TypeScript essentials. Try examples at typescriptlang.org/play.
Last updated: March 2026
Variables const name = "Alex"; // constant — cannot reassign let count = 0; // block-scoped — can reassign // var — avoid (function-scoped, hoisted, error-prone) TypeScript Types // Basic types let name: string = "Alex"; let age: number = 25; let active: boolean = true; let items: string[] = ["a", "b"]; let tuple: [string, number] = ["Alex", 25]; let anything: any = "skip type checking"; // avoid let safe: unknown = "must check before use"; // safer than any // Type inference — no annotation needed when obvious const name = "Alex"; // TypeScript infers string // Union types let id: string | number = "abc"; // Literal types type Direction = "north" | "south" | "east" | "west"; // Interfaces interface User { name: string; age: number; email?: string; // optional readonly id: number; // cannot modify after creation } // Type aliases type Point = { x: number; y: number }; type StringOrNumber = string | number; // Generics function first<T>(items: T[]): T | undefined { return items[0]; } Utility Types Type Description Example Partial<T> All properties optional Partial<User> Required<T> All properties required Required<User> Pick<T, K> Select properties Pick<User, "name" | "email"> Omit<T, K> Remove properties Omit<User, "id"> Record<K, V> Key-value map type Record<string, number> Readonly<T> All properties readonly Readonly<User> ReturnType<F> Function return type ReturnType<typeof fn> Parameters<F> Function parameter types Parameters<typeof fn> Functions // Arrow function const greet = (name: string): string => `Hello ${name}`; // Default parameters const greet = (name = "World") => `Hello ${name}`; // Rest parameters const sum = (...nums: number[]) => nums.reduce((a, b) => a + b, 0); // Destructured parameters const greet = ({ name, age }: User) => `${name}, ${age}`; // Function overloads (TypeScript) function format(value: string): string; function format(value: number): string; function format(value: string | number): string { return String(value); } Strings const name = "Alex"; `Hello ${name}` // template literal `Total: ${price * 1.2}` // expression `Line 1 Line 2` // multi-line "hello".toUpperCase() // "HELLO" "hello".includes("ell") // true "hello".startsWith("he") // true "hello world".split(" ") // ["hello", "world"] " hello ".trim() // "hello" "hello".padStart(10, ".") // ".....hello" "hello".repeat(3) // "hellohellohello" "hello".at(-1) // "o" (last char) "hello".replaceAll("l", "r") // "herro" Arrays const nums = [1, 2, 3, 4, 5]; // Transform nums.map(x => x * 2) // [2, 4, 6, 8, 10] nums.filter(x => x > 2) // [3, 4, 5] nums.reduce((sum, x) => sum + x, 0) // 15 [1, [2, 3], [4, 5]].flat() // flatten nested arrays: [1, 2, 3, 4, 5] nums.flatMap(x => [x, x * 10]) // [1, 10, 2, 20, ...] // Search nums.find(x => x > 3) // 4 nums.findIndex(x => x > 3) // 3 nums.includes(3) // true nums.some(x => x > 4) // true nums.every(x => x > 0) // true nums.indexOf(3) // 2 // Modify nums.push(6) // add to end nums.pop() // remove from end nums.unshift(0) // add to start nums.shift() // remove from start nums.splice(1, 2) // remove 2 items at index 1 nums.slice(1, 3) // [2, 3] (no mutation) // Sort nums.sort((a, b) => a - b) // ascending (MUTATES original!) nums.sort((a, b) => b - a) // descending (MUTATES original!) nums.toSorted((a, b) => a - b) // new sorted array (no mutation, ES2023+) nums.toReversed() // new reversed array // Create Array.from({ length: 5 }, (_, i) => i) // [0, 1, 2, 3, 4] Array.from("hello") // ["h", "e", "l", "l", "o"] [...new Set(nums)] // remove duplicates Objects // Destructuring const { name, age } = user; const { name, ...rest } = user; // rest = everything except name // Spread const updated = { ...user, age: 26 }; // clone + update const merged = { ...obj1, ...obj2 }; // merge // Computed property names const key = "name"; const obj = { [key]: "Alex" }; // { name: "Alex" } // Optional chaining user?.address?.city // undefined if any is null/undefined user?.getName?.() // call method if it exists // Nullish coalescing const name = user.name ?? "Unknown"; // "Unknown" only if null/undefined // Unlike ||, does NOT fall back on "" or 0 or false // Logical assignment operators (ES2021) x ??= 10; // x = x ?? 10 (assign if null/undefined) x &&= 10; // x = x && 10 (assign if truthy) x ||= 10; // x = x || 10 (assign if falsy) // Object methods Object.keys(obj) // ["name", "age"] Object.values(obj) // ["Alex", 25] Object.entries(obj) // [["name", "Alex"], ["age", 25]] Object.fromEntries(entries) // back to object Object.assign({}, obj1, obj2) // merge (older syntax) Async/Await // Async function async function fetchUser(id: number): Promise<User> { const response = await fetch(`/api/users/${id}`); if (!response.ok) throw new Error("Failed to fetch"); return response.json(); } // Error handling try { const user = await fetchUser(1); } catch (error) { console.error("Error:", error); } // Parallel execution const [users, posts] = await Promise.all([ fetchUsers(), fetchPosts() ]); // Race — first to resolve wins const result = await Promise.race([fetchData(), timeout(5000)]); // Promise.allSettled — wait for all, never rejects const results = await Promise.allSettled([fetchA(), fetchB()]); results.forEach(r => { if (r.status === "fulfilled") console.log(r.value); if (r.status === "rejected") console.log(r.reason); }); Modules // Named exports export const API_URL = "https://api.example.com"; export function fetchData() { } // Default export export default class UserService { } // Import import UserService from "./user-service"; import { API_URL, fetchData } from "./api"; import * as api from "./api"; // Dynamic import (lazy loading) const module = await import("./heavy-module"); Classes (TypeScript) class User { private id: number; public name: string; readonly email: string; constructor(id: number, name: string, email: string) { this.id = id; this.name = name; this.email = email; } // Shorthand constructor // constructor(private id: number, public name: string) {} greet(): string { return `Hi, I'm ${this.name}`; } } // Abstract class abstract class Shape { abstract area(): number; } class Circle extends Shape { constructor(private radius: number) { super(); } area(): number { return Math.PI * this.radius ** 2; } } Type Guards (TypeScript) // typeof if (typeof value === "string") { value.toUpperCase(); // TypeScript knows it's string } // instanceof if (error instanceof TypeError) { error.message; // TypeScript knows it's TypeError } // Custom type guard function isUser(obj: unknown): obj is User { return ( typeof obj === "object" && obj !== null && "name" in obj && "age" in obj && "id" in obj ); } // Discriminated union type Result = | { status: "success"; data: string } | { status: "error"; message: string }; function handle(result: Result) { if (result.status === "success") { result.data; // TypeScript knows data exists } } Modern TypeScript Features // satisfies — validate type without widening const config = { port: 3000, host: "localhost" } satisfies Record<string, string | number>; // config.port is still number (not string | number) // as const — immutable literal type const COLORS = ["red", "green", "blue"] as const; type Color = typeof COLORS[number]; // "red" | "green" | "blue" // template literal types type EventName = `on${Capitalize<string>}`; // "onClick", "onHover", etc. Common Mistakes == vs === — == does type coercion ("1" == 1 is true). Always use === for strict equality. The only exception: value == null checks both null and undefined.
...