npm install -g typescript

tsc --init

tsc filename.ts

let username: string = "Sam";

let count = 5; // inferred as number

const MAX_RETRIES = 3;

const scores: number[] = [10, 20, 30];
const names: Array<string> = ["A", "B"];

const point: [number, number] = [10, 20];

{
  "compilerOptions": {
    "strict": true,
    "target": "ES2022"
  }
}

tsc --watch

class User {
  constructor(public name: string, public age: number) {}
}

class Point {
  constructor(readonly x: number, readonly y: number) {}
}

class Animal {
  move() { console.log("moving"); }
}
class Dog extends Animal {
  bark() { console.log("woof"); }
}

class Cat extends Animal {
  constructor(public name: string) {
    super();
  }
}

Create a string enum to assign readable values to each member.

enum Status {
  Active = "active",
  Inactive = "inactive",
  Pending = "pending"
}

const userStatus: Status = Status.Active; // "active"

Use string enums in switch statements for exhaustive, readable checks.

function describe(status: Status): string {
  switch (status) {
    case Status.Active:   return "User is active";
    case Status.Inactive: return "User is inactive";
    case Status.Pending:  return "Awaiting approval";
  }
}

Match API or database string values directly using string enum members.

// API returns { status: "active" } — enum value matches exactly
const fromApi: Status = "active" as Status;

Iterate over all string enum values using Object.values.

const allStatuses = Object.values(Status);
// ["active", "inactive", "pending"]

Use a string enum to keep role names self-documenting in conditions.

enum Role { Admin = "admin", User = "user", Guest = "guest" }

function checkRole(role: Role) {
  if (role === Role.Admin) console.log("is admin"); // "admin" in logs
}

Declare a const enum to inline every member as a literal at compile time.

const enum Color {
  Red = "red",
  Green = "green",
  Blue = "blue"
}

const myColor: Color = Color.Red;
// Compiles to: const myColor = "red";

Verify zero runtime overhead — no JS object is generated in the bundle.

const enum Direction { Up, Down, Left, Right }
const dir = Direction.Up;
// Compiles to: const dir = 0; — no Direction object exists at runtime

Show the size difference between regular and const enums.

// Regular enum: creates a runtime object (adds ~200 bytes)
// Const enum: replaces each use with its literal value (adds 0 bytes)
const enum Size { Small = "sm", Large = "lg" }
const s: Size = Size.Small; // becomes: const s = "sm";

Use string const enums safely when sharing across module boundaries.

// Safe for cross-module use with string values
const enum HttpMethod {
  Get = "GET",
  Post = "POST",
  Put = "PUT"
}

Avoid const enums in .d.ts library files — consumers cannot inline them.

// In a .d.ts file, prefer a union type or regular enum
export type HttpMethod = "GET" | "POST" | "PUT";

Use a numeric enum for HTTP status codes to keep values readable.

enum HttpStatus {
  Ok = 200,
  Created = 201,
  BadRequest = 400,
  Unauthorized = 401,
  NotFound = 404
}

Write a type guard to check if a runtime value is a valid enum member.

function isValidStatus(value: unknown): value is Status {
  return Object.values(Status).includes(value as Status);
}

Export all enums from a central file to share them across modules.

// enums.ts
export enum UserRole { Admin = "admin", User = "user" }

// other-file.ts
import { UserRole } from "./enums";

Use Record with an enum type to create exhaustive display label maps.

const statusLabels: Record<Status, string> = {
  [Status.Active]:   "Active",
  [Status.Inactive]: "Inactive",
  [Status.Pending]:  "Pending"
};

console.log(statusLabels[Status.Active]); // "Active"

Use enums as discriminants in discriminated union types for events.

enum EventType { Click = "click", KeyPress = "keypress" }

type AppEvent =
  | { type: EventType.Click; x: number; y: number }
  | { type: EventType.KeyPress; key: string };

enum Direction {
  Up = 0,
  Right = 1,
  Down = 2,
  Left = 3
}

const dir: Direction = Direction.Up;

enum Status {
  Active = 1,
  Inactive = 2
}

console.log(Status[1]);  // "Active"
console.log(Status.Active);  // 1

enum Level {
  Low,      // 0
  Medium,   // 1
  High      // 2
}

enum Priority {
  Low = 1,  // avoids if (priority) being false for Low
  Medium,   // 2
  High      // 3
}

enum Permission {
  None  = 0,
  Read  = 1 << 0, // 1
  Write = 1 << 1, // 2
  Admin = 1 << 2  // 4
}

const canEdit = Permission.Read | Permission.Write; // 3

enum Mixed {
  No = 0,
  Yes = "YES"
}

// Confusing: mixing types makes iteration and reverse lookup unpredictable
enum Bad { A = 0, B = "b" }

// Better: separate enums
enum NumericStatus {
  Inactive = 0,
  Active = 1
}

enum StringStatus {
  Inactive = "inactive",
  Active = "active"
}

// Safe: all strings — Object.values returns only the values
enum Color { Red = "red", Green = "green", Blue = "blue" }
const colors = Object.values(Color); // ["red", "green", "blue"]

// Prefer string or numeric uniformly to avoid compiler warnings
enum Uniform { A = "a", B = "b", C = "c" } // clean

function greet(name: string) {
  console.log(`Hello ${name}`);
}

greet(123); // error: number is not assignable to string
// Fix: greet("Alice");

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

const user: User = { name: "Alice" };
// error: property 'age' is missing
// Fix: add age property

interface User {
  age: number;
}

const user: User = { age: "30" };
// error: string is not assignable to number
// Fix: change age to 30 (without quotes)

function setStatus(status: "active" | "inactive") { }

const s: string = "active";
setStatus(s); // error: string is not assignable
// Fix: type s as the exact union or use a literal
setStatus(s as "active" | "inactive");

function getId(): number {
  return "abc"; // error: string is not assignable to number
}
// Fix: return a number
function getId(): number {
  return 42;
}

interface User {
  name: string;
}

const user: User = { name: "Alice" };
console.log(user.Name); // error: Property 'Name' does not exist
// Fix: use lowercase 'name'

const user = { name: "Alice" };
console.log(user.age); // error: property 'age' does not exist
// Fix: add age to the type
interface User { name: string; age: number; }

const user: User | null = null;
console.log(user.name); // error: object is possibly null
// Fix: add null check
if (user) {
  console.log(user.name);
}

type Shape = { kind: "circle"; radius: number } | { kind: "square"; side: number };

function area(s: Shape) {
  return s.radius; // error: 'radius' does not exist on 'square'
  // Fix: narrow with a type guard
  if (s.kind === "circle") return Math.PI * s.radius ** 2;
}

const map: Record<string, number> = {};
const val: number = map["key"]; // may be undefined
// Fix: check first or use optional chaining
const val2 = map["key"] ?? 0;

const value: unknown = "hello";
const length = (value as string).length; // OK

const value: string | number = "hello";
if (typeof value === "string") {
  console.log(value.length); // OK — TypeScript knows it's a string
}

const user: User | null = getUser();
console.log(user!.name); // tells TypeScript user is not null
// Only use if you're certain the value is not null

const config = {
  host: "localhost",
  port: 3000
} satisfies Record<string, string | number>;
// config.port is still typed as number, not string | number

const value = getAnything() as unknown as SpecificType;
// Use sparingly — only when you know the runtime type is correct

interface User {
  id: number;
  email?: string;
}

interface Point {
  readonly x: number;
  readonly y: number;
}

interface Scores {
  [name: string]: number;
}

interface Animal {
  name: string;
}
interface Dog extends Animal {
  breed: string;
}

interface Hybrid extends Animal, Trainable {}

// utils.ts
export const PI = 3.14159;
export function double(n: number) {
  return n * 2;
}

import { PI, double } from "./utils";

import { double as multiplyByTwo } from "./utils";

// index.ts
export { double, PI } from "./utils";
export { default as log } from "./logger";

export * from "./utils";

import { Button } from "@/components/Button";

{ "compilerOptions": { "strict": true } }

{
  "include": ["src/**/*"],
  "exclude": ["node_modules", "dist"]
}

{
  "compilerOptions": {
    "baseUrl": "./src",
    "paths": { "@/*": ["*"] }
  }
}

type User = {
  id: number;
  name: string;
};

type ID = number | string;

const user: User = { id: 1, name: "Sam" };

type Named = { name: string };
type Aged = { age: number };
type Person = Named & Aged;

const sam: Person = { name: "Sam", age: 30 };

type Box<T> = { value: T };
const n: Box<number> = { value: 42 };

type IsString<T> = T extends string ? true : false;

type Optional<T> = { [K in keyof T]?: T[K] };

async function fetchData() {
  try {
    const data = await fetch('/api/data');
    return data.json();
  } catch (error) {
    console.error('Failed to fetch:', error);
    return null;
  }
}

async function safeLoad(url: string) {
  try {
    const res = await fetch(url);
    const json = await res.json(); // can also throw
    return json;
  } catch (err) {
    return null;
  }
}

async function fetchUser(id: number) {
  try {
    return await getUser(id);
  } catch (err) {
    if (err instanceof Error) {
      console.error(err.message);
    }
  }
}

async function loadConfig() {
  try {
    return await fetchConfig();
  } catch (err) {
    logger.error('Config load failed', err);
    throw err; // let the caller decide
  }
}

async function apiGet(url: string) {
  const res = await fetch(url);
  if (!res.ok) {
    throw new Error(`HTTP ${res.status}: ${res.statusText}`);
  }
  return res.json();
}

async function getPostWithAuthor(postId: number) {
  const post = await fetchPost(postId);
  const author = await fetchUser(post.userId);
  return { post, author };
}

async function createAndNotify(data: NewUser) {
  const user = await createUser(data);
  const token = await generateToken(user.id);
  await sendWelcomeEmail(user.email, token);
  return user;
}

async function processQueue(ids: number[]) {
  for (const id of ids) {
    await processItem(id); // each waits before next
  }
}

async function runSteps(steps: Array<() => Promise<string>>) {
  return steps.reduce(async (prev, step) => {
    const results = await prev;
    const result = await step();
    return [...results, result];
  }, Promise.resolve<string[]>([]));
}

async function readStream(stream: AsyncIterable<string>) {
  for await (const chunk of stream) {
    console.log(chunk);
  }
}

// mylib.d.ts
export function greet(name: string): string;
export interface User {
  id: number;
  name: string;
}

// index.d.ts
export class Calculator {
  add(a: number, b: number): number;
  subtract(a: number, b: number): number;
}

declare global {
  interface Window {
    myGlobal: string;
  }
}

declare const __VERSION__: string;
declare function require(module: string): any;

export as namespace MyLib;
export function init(options: Options): void;
export interface Options {
  debug?: boolean;
}

{
  "name": "my-library",
  "version": "1.0.0",
  "main": "dist/index.js",
  "types": "dist/index.d.ts"
}

{
  "compilerOptions": {
    "declaration": true,
    "declarationDir": "./dist",
    "outDir": "./dist"
  }
}

{
  "typesVersions": {
    "<=4.0": { "*": ["ts4.0/*"] },
    ">=4.1": { "*": ["*"] }
  }
}

{
  "exports": {
    ".": {
      "import": { "types": "./dist/esm/index.d.ts", "default": "./dist/esm/index.js" },
      "require": { "types": "./dist/cjs/index.d.ts", "default": "./dist/cjs/index.js" }
    }
  }
}

{
  "compilerOptions": {
    "declarationMap": true,
    "declaration": true,
    "sourceRoot": "./src"
  }
}

// Don't declare types that don't match the implementation
export function add(a: number, b: number): number;
// Should match: const add = (a, b) => a + b;

// Correct: public types are exported
export interface PublicAPI { }

// Wrong: internal types shouldn't be exported
// export interface _InternalHelper { }

/**
 * Processes data asynchronously
 * @param data - The input data to process
 * @returns A promise that resolves with the result
 */
export function processAsync(data: any): Promise<any>;

# Bump patch for additions, minor for new overloads, major for removals
npm version patch  # safe: new optional param
npm version major  # breaking: removed export

// Weak: loses type information
export function parse(input: string): any;

// Better: let the caller specify the return type
export function parse<T>(input: string): T;

function first<T>(items: T[]): T | undefined {
  return items[0];
}

function pair<T, U>(a: T, b: U): [T, U] {
  return [a, b];
}

interface ApiResponse<T = unknown> {
  data: T;
  status: number;
}

const res: ApiResponse = { data: null, status: 200 };

type Config<T extends object = {}> = { values: T };

function getLength<T extends { length: number }>(item: T): number {
  return item.length;
}

getLength("hello");     // works: string has length
getLength([1, 2, 3]);   // works: array has length
getLength(123);         // error: number has no length

function identity<T extends string | number>(value: T): T {
  return value;
}

identity("text");  // works
identity(42);      // works
identity({});      // error

interface HasId {
  id: string;
}

function getId<T extends HasId>(item: T): string {
  return item.id;
}

interface HasId {
  id: string;
}

interface HasName {
  name: string;
}

function process<T extends HasId & HasName>(item: T): string {
  return `${item.id}: ${item.name}`;
}

function merge<T extends object, U extends object>(
  obj1: T,
  obj2: U
): T & U {
  return { ...obj1, ...obj2 };
}

function getValue<T extends string | number | boolean>(
  value: T
): T extends string ? string : T extends number ? number : boolean {
  return value;
}

function findById<T extends { id: string | number }>(
  items: T[],
  id: string | number
): T | undefined {
  return items.find(item => item.id === id);
}

function mapProperty<T, K extends keyof T>(
  items: T[],
  key: K
): T[K][] {
  return items.map(item => item[key]);
}

const names = mapProperty(users, "name");

type EventMap = {
  login: { userId: string };
  logout: { timestamp: number };
};

function on<E extends keyof EventMap>(
  event: E,
  handler: (data: EventMap[E]) => void
) {
  // Type-safe handler
}

const name = user?.name ?? "Guest";
const count = value ?? 0;

const count = 0;

console.log(count || 10); // 10 — wrong, zero is falsy
console.log(count ?? 10); // 0  — correct, zero is not null

let config: Config | null = null;
config ??= defaultConfig; // assigned only when null or undefined

const role = user?.permissions?.role ?? "viewer";

function paginate(page: number | null, size: number | null) {
  const p = page ?? 1;
  const s = size ?? 20;
  return { page: p, size: s };
}