Suggest an edit

Improve this article

Refine the answer for “How do you set a default parameter?”. Your changes go to moderation before they’re published.

Approval required

Content

What you’re changing

Title (EN)

Short answer (EN)

Shown above the full answer for quick recall.

Answer (EN)

## 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)

Markdown · drag & drop images · ⌘B / ⌘I shortcuts566 words

For the reviewer

Note to the moderator (optional)

Visible only to the moderator. Helps review go faster.