Optional and Default Parameters

Difficulty: Beginner

TypeScript functions support optional parameters, default values, and rest parameters, giving you flexibility in how functions are called. Optional parameters are marked with a `?` after the parameter name: `function greet(name: string, greeting?: string)`. When a parameter is optional, its type becomes a union with `undefined` - so `greeting` is effectively `string | undefined`. Optional parameters must come after all required parameters.

Default parameter values provide a fallback when an argument isn't provided or is explicitly `undefined`. The syntax is `function greet(name: string, greeting: string = "Hello")`. When you provide a default value, TypeScript infers the parameter type from that value, so you often don't need an explicit annotation. Default parameters can appear in any position, but placing them at the end is conventional so callers can simply omit them.

Rest parameters collect all remaining arguments into an array. They use the spread syntax: `function sum(...numbers: number[])`. A rest parameter must be the last parameter in the function signature. The collected array is typed, so `...numbers: number[]` means every extra argument must be a number. Rest parameters are particularly useful for variadic functions - functions that accept any number of arguments.

An important distinction: optional parameters with `?` default to `undefined`, while parameters with default values substitute the default when `undefined` is passed. If you write `function f(x: number = 10)` and call `f(undefined)`, `x` will be `10`, not `undefined`. This is a JavaScript runtime behavior that TypeScript's type system correctly models.

Code examples

Optional parameters

function createUser(
  name: string,
  email: string,
  age?: number,
  role?: string
): string {
  let result = `${name} <${email}>`;
  if (age !== undefined) {
    result += `, age ${age}`;
  }
  if (role !== undefined) {
    result += ` (${role})`;
  }
  return result;
}

console.log(createUser("Alice", "alice@mail.com"));
console.log(createUser("Bob", "bob@mail.com", 25));
console.log(createUser("Charlie", "charlie@mail.com", 30, "admin"));

Optional parameters are marked with `?` and must come after required parameters. Inside the function, check for undefined before using them.

Default parameter values

function formatDate(
  date: Date,
  locale: string = "en-US",
  style: "short" | "medium" | "long" = "medium"
): string {
  const options: Record<string, string> = {};
  if (style === "short") {
    options.dateStyle = "short";
  } else if (style === "long") {
    options.dateStyle = "long";
  } else {
    options.dateStyle = "medium";
  }
  return date.toLocaleDateString(locale, options);
}

const date = new Date(2026, 2, 12);
console.log(formatDate(date));
console.log(formatDate(date, "en-US", "short"));
console.log(formatDate(date, "en-US", "long"));

Default values are used when an argument is omitted or undefined. TypeScript infers the parameter type from the default value, so you often don't need explicit annotations.

Rest parameters

function sum(...numbers: number[]): number {
  return numbers.reduce((total, n) => total + n, 0);
}

function joinWords(separator: string, ...words: string[]): string {
  return words.join(separator);
}

console.log(sum(1, 2, 3, 4, 5));
console.log(sum(10, 20));
console.log(joinWords("-", "hello", "typed", "world"));
console.log(joinWords(", ", "a", "b", "c"));

Rest parameters collect remaining arguments into a typed array. They must be the last parameter. The `...numbers: number[]` syntax ensures every argument is a number.

Key points

• Optional parameters (`?`) must come after all required parameters in the function signature.
• Default values make a parameter effectively optional - callers can omit it or pass `undefined` to get the default.
• Rest parameters must be the last parameter and collect all remaining arguments into a typed array.

Concepts covered

Optional parameters, Default values, Rest parameters, Parameter ordering