Default & rest parameters

The parameter toolbox

A parameter is the named input in a function declaration. An argument is the value you pass when you call it. You met that distinction in Declaring & calling functions. This lesson adds the tools that make function inputs pleasant in real programs.

JavaScript is forgiving: a missing argument becomes undefined, and extra arguments are usually ignored. That flexibility is useful, but it can make functions vague unless you choose a clear pattern:

• Default parameters fill in a value when an argument is missing.
• Rest parameters gather any number of arguments into a real array.
• Spread in a call does the opposite: it unpacks an array into separate arguments.
• The arguments object is the older way to see everything that was passed.
• Options objects help you simulate overloading without pretending JavaScript has overloaded signatures.

Keep one rule in your head as we start: defaults handle missing arguments, not every value that feels empty. That is different from some uses of || you may have seen, and it pairs nicely with the Nullish coalescing lesson’s idea of being precise about absence.

A default parameter places = value right in the function header. It reads like a promise: “if the caller does not give me this value, use this one.”

function greet(name = "friend") {
  return "Hello, " + name;
}

greet();        // "Hello, friend"
greet("Ada");  // "Hello, Ada"

The exact trigger matters. Step through this real run and switch the call on line 5. Notice that null and 0 do not mean “use the default.”

1function greet(name = "friend") {2  const message = "Hello, " + name;3  console.log(message);4}5greet();Run

Later defaults can use earlier parameters because JavaScript fills them from left to right. This is handy for paired values:

function box(width, height = width) {
  return width + " × " + height;
}

box(5);     // "5 × 5"
box(5, 2);  // "5 × 2"

The pitfall is putting a default before a required-looking parameter: function label(prefix = "Item", text) { ... }. A call like label("Save") fills prefix, not text. Prefer required inputs first, defaults after them, or use an options object when there are several optional pieces.

A default expression is evaluated when the function is called, not once when the function is created. That means Date.now() would get a fresh time, and [] creates a fresh array for that call.

1function remember(item, list = []) {2  list.push(item);3  console.log(list.join(","));4}5remember("tea");Run6remember("cake");

This is good news. In some languages a default array can become shared state by accident. In JavaScript, list = [] inside the parameter list is made again for every call that needs it.

Sometimes one function should accept any number of values: zero scores, three tags, five names, however many the caller has. A rest parameter uses three dots before the final parameter name:

1function sum(...numbers) {2  let total = 0;3  for (const number of numbers) {4    total = total + number;5  }6  return total;7}

The rest parameter must be last. JavaScript needs every argument after the fixed parameters to go into that one array, so there cannot be another parameter after it.

function log(level, ...messages) {  // ✅ rest is last
  return messages.length;
}

function bad(...items, last) {        // ❌ SyntaxError
  return last;
}

Because rest gives you a real array, the for...of loop you learned earlier fits perfectly. Arrays get their full treatment in Stage 3, but for now it is enough to know that a rest array has length, indexes, and array methods.

Before rest parameters existed, JavaScript functions used the automatic arguments object. It lists every argument passed to an old-style function body. You will see it in older code, but new code should usually choose rest.

1function inspect() {2  console.log(arguments.length);3  console.log(arguments[0]);4  console.log(Array.from(arguments).join(" | "));5}6inspect("Ada", "Grace", "Lin");Run

function broken() {
  return arguments.map((value) => value);
}
broken(1, 2, 3);

That snippet throws a TypeError because arguments is array-like, not a real array. Convert it first with Array.from(arguments), or better, write function broken(...values) and use values.map.

The same ... syntax has an opposite job in a function call. Rest gathers many arguments into one array. Spread unpacks one iterable value—like a simple array—into many arguments.

const scores = [18, 7, 21];
console.log(Math.max(...scores));
console.log(Math.max(10, ...scores, 30));

Simulating overloading

Some languages let you define several functions with the same name but different parameter lists. That is called overloading by signature. JavaScript does not do that. If you define the same function name twice, the later one wins.

Instead, write one function that decides what the caller meant. For small cases, branch on arguments.length, typeof, or Array.isArray. For readable real code, the modern favorite is an options object with defaults.

function createUser({ name = "Anonymous", role = "viewer" } = {}) {
  return name + " (" + role + ")";
}
console.log(createUser({ name: "Ada" }));
console.log(createUser({ name: "Grace", role: "admin" }));
console.log(createUser());

The braces in the parameter gently introduce destructuring: pull the name and role properties out of the object. The Destructuring lesson later gives that syntax a full tour. The = default means createUser() is safe, and role = "viewer" fills in the missing property.

Common misconceptions

Answer from the code, not from memory. Every wrong option explains the trap.

Key takeaways

• Default parameters run only for missing arguments or undefined.
• Default expressions are evaluated at call time, so [] is fresh for each call that needs it.
• Rest parameters gather arguments into a real array and must be last.
• arguments is old, array-like, and absent from arrow functions’ own scope; prefer rest.
• Spread in calls unpacks arrays into separate arguments.
• JavaScript simulates overloading by branching inside one function or by accepting an options object.

Up next: Function expressions & callbacks.