How do you set a default parameter?

TypeScriptJunior~1 min read

Default parameter syntax

javascript

function functionName(parameter: Type = defaultValue): ReturnType {
  // ...
}

If an argument is not passed when the function is called, the value specified after the = sign is used.

Example 1. A simple default parameter

javascript

function greet(name: string = "Guest"): void {
  console.log(`Hi, ${name}!`);
}

greet();         // "Hi, Guest!"
greet("Tim");    // "Hi, Tim!"

Here:

the name parameter has the type string
when no argument is passed, the function uses "Guest"

Example 2. Several parameters with different default values

javascript

function connect(host: string = "localhost", port: number = 3000): void {
  console.log(`Connecting to ${host}:${port}`);
}

connect();                  // localhost:3000
connect("127.0.0.1");       // 127.0.0.1:3000
connect("192.168.1.1", 8080); // 192.168.1.1:8080

Example 3. A default value can depend on other parameters

javascript

function createUser(name: string, isAdmin: boolean = false) {
  console.log({ name, isAdmin });
}

createUser("Tim");          // { name: 'Tim', isAdmin: false }
createUser("Alex", true);   // { name: 'Alex', isAdmin: true }

Example 4. Complex default values

You can use objects, arrays, and even function calls:

javascript

function generateId(): number {
  return Math.floor(Math.random() * 1000);
}

function createUser(name: string, id: number = generateId()) {
  console.log(`User ${name}, id: ${id}`);
}

createUser("Tim");  // random id
createUser("Alex", 42); // id = 42

How TypeScript types parameters with a default value

A parameter with a default value is automatically considered optional, but its type is inferred from the value.

javascript

function logCount(count = 10) {
  // type of count → number (TS inferred it itself)
  console.log(count);
}

Equivalent to:

javascript

function logCount(count: number = 10) { ... }

That is, if you specified a default value, the question mark (?) is not needed. These two forms are different:

javascript

function test(a?: number) {} // the parameter can be undefined
function test(a: number = 5) {} // the parameter is always number (never undefined)

Error from the wrong order

Parameters with default values must come after required ones:

javascript

function greet(name = "Guest", age: number) {} // Error

It should be:

javascript

function greet(age: number, name = "Guest") {} //

But you can place required parameters after, if they are explicitly passed at the call site - then TypeScript has no objection:

javascript
function greet(name = "Guest", age?: number) {} greet(undefined, 25); //

Example: combining `?` and `=`

Sometimes it is useful to explicitly state that a parameter may be passed, but if it is undefined, a default is substituted:

javascript

function greet(name?: string) {
  const finalName = name ?? "Guest"; // the nullish coalescing operator
  console.log(`Hi, ${finalName}!`);
}

greet();          // Hi, Guest!
greet(undefined); // Hi, Guest!
greet("Tim");     // Hi, Tim!

Summary

Example	Behavior	Parameter type
`function f(x = 10)`	substitutes 10 if not passed	`number`
`function f(x?: number)`	`x` can be `undefined`	`number \| undefined`
`function f(x: number = 10)`	`x` is always `number`, even if not passed	`number`
`function f(a: string, b = a + "!")`	the value depends on another argument	`string`

A simple way to remember it

= → the value is substituted automatically ? → the value may not be passed (undefined)

Short Answer

Interview ready

Premium

A concise answer to help you respond confidently on this topic during an interview.