Default Parameters in JavaScript Functions: From Chaos to Elegance

A parameter without a gift? Understanding default values in JavaScript

Imagine you ordered a pizza. You call the delivery service and say: "I'd like a pizza, please." The operator asks: "What kind?" — "Well, the standard one, with cheese and sausage." You don't even think about the pizza having default parameters.

It's the same in JavaScript: functions are often called without all the arguments. And if the programmer didn't provide a set a default parameter value for a JavaScript function, the code can break or behave unpredictably. In this article, we'll cover all the ways to set a default value for a function parameter in JS — from the old reliable workarounds to modern ES6 syntax. Let's go!

Why is this even important?

Let's say we have a function that greets a user:

function greet(name) {\n    console.log('Hello, ' + name + '!');\n}\n\ngreet(); // Outputs: "Hello, undefined!" — awkward, right?

Without default parameters javascript, a missing argument becomes undefined. And if we try to call a method on undefined — we get an error. Therefore, default parameters js is not just a convenience, but a protection against bugs.

Method 1: Classic — ternary operator (or if)

Before ES6, developers used the ternary operator javascript or a simple check. It works, but looks cumbersome:

function multiply(a, b) {\n    a = a !== undefined ? a : 1;\n    b = b !== undefined ? b : 2;\n    return a * b;\n}\n\nconsole.log(multiply(5)); // 10 (5 * 2)\nconsole.log(multiply());  // 2 (1 * 2)

Pros: Clear even for beginners, compatible with ancient browsers.
\nCons: Code becomes bloated. If there are 5–6 parameters, readability drops sharply.

Hidden pitfall: checking for undefined vs truthy

Many beginners write it like this:

function greet(name) {\n    name = name || 'Guest';\n    console.log('Hello, ' + name);\n}

This works until you pass 0, an empty string '', or false. All these values are falsy, and the function will replace them with 'Guest'. If you need to pass 0 as a valid value — this approach will break. Use a strict check for undefined.

Method 2: The magical arguments object

Inside every function (except arrow functions), there is an implicit array-like object arguments javascript. It can be used to check the passed arguments:

function showInfo(name, age) {\n    name = arguments.length > 0 ? name : 'Anonymous';\n    age = arguments.length > 1 ? age : 'not specified';\n    return `${name}, age: ${age}`;\n}\n\nconsole.log(showInfo()); // Anonymous, age: not specified

Pros: Gives full control over which arguments are passed.
\nCons: Syntax is outdated, doesn't work in arrow functions. Usually used only for very specific tasks (e.g., when the number of parameters is unknown in advance).

Method 3: Modern standard — ES6 default parameters

Starting with ECMAScript 2015, you can set default parameters js directly in the function declaration. This is the cleanest and most recommended way:

function multiply(a = 1, b = 2) {\n    return a * b;\n}\n\nconsole.log(multiply(5)); // 10\nconsole.log(multiply());  // 2

Beautiful, isn't it? But there are important nuances you need to know to avoid falling into a trap.

Nuance 1: Default values are evaluated at call time

This means that if you pass undefined — the default will be used. If you pass null — it won't:

function test(x = 10) {\n