How do default parameters work?
By FrontendPro Editorial Team Updated 9/26/2026
Answer
A default is used when the argument is undefined — and only then.
function greet(name = "Guest") {
return `Hello, ${name}`;
}
greet(); // "Hello, Guest"
greet(undefined); // "Hello, Guest" — also triggers the default
greet(null); // "Hello, null" — null is a value, not "missing"
greet(""); // "Hello, " — empty string too
That null row is the detail people miss. If you want falsy values to fall back as well, use ?? inside the body — but note || would also discard a legitimate 0 or "".
Defaults are evaluated at call time
Each call creates a fresh value, so a mutable default is not shared between calls:
function add(item, list = []) { // new array every call
list.push(item);
return list;
}
They can also be expressions, and can reference earlier parameters:
function makeUser(name, id = crypto.randomUUID(), label = `${name}#${id}`) {}
Only earlier ones — referring to a later parameter throws, since they initialise left to right.
With destructuring
function config({ retries = 3, timeout = 1000 } = {}) {}
config(); // works thanks to the trailing = {}
Without that = {}, calling with no argument tries to destructure undefined and throws. This is the most common mistake with options objects.
Two side effects
Parameters with defaults do not count towards fn.length, which matters if some code inspects arity — a generic curry helper, for instance.
And put defaulted parameters last. A default in the middle forces callers to pass undefined explicitly to skip it, which is worse than having no default at all.
