JavaScript Default Parameters — What is the Output?

Why This Question Matters

If you've been writing JavaScript for a while, you probably use default parameters every day. They seem straightforward: if you don't provide a value, the function uses the default. Simple, right?

Wrong.

The confusion kicks in when you start dealing with undefined versus null. In many languages, these are treated similarly, but in JavaScript, they trigger completely different behaviors when it comes to default function arguments. If you're prepping for a technical interview or just trying to debug why your UI is showing "Hello, null!" instead of "Hello, World!", you need to understand how the engine actually evaluates these values.

Understanding the Code

Let's look at the snippet:

function greet(name = "World") {
  console.log(Hello, ${name}!)
}
greet()

greet(undefined)

greet(null)

Here, we have a function with a default parameter. The name = "World" syntax tells JavaScript: "If the value passed here is missing or undefined, use 'World' instead."

When you call greet(), you aren't passing any arguments. In JavaScript, missing arguments are automatically treated as undefined. Since the value is undefined, the engine kicks in and assigns the default value.
Output: Hello, World!

When you call greet(undefined), you are explicitly passing undefined. To the JavaScript engine, there is no difference between a missing argument and an explicit undefined. It still triggers the default parameter.
Output: Hello, World!

Now, here is where people trip up: greet(null).
In JavaScript, null is an actual value. It represents the intentional absence of any object value. Because null is considered a defined value (even if that value is "nothing"), it does not trigger the default parameter. The function accepts null as the valid input for name.
Output: Hello, null!

Finding the Correct Answer

The correct answer is Option B, which would look like this:
- Hello, World!
- Hello, World!
- Hello, null!

Why not the others? Some developers assume that because null is "falsy," it will trigger the default. That's a common misconception. Default parameters only trigger for undefined. They don't care if the value is null, false, 0, or an empty string. If it's not undefined, the default is ignored.

Common Mistakes Developers Make

The biggest mistake I see is treating null and undefined as interchangeable. They aren't.

One common trap is trying to "reset" a value by passing null into a function, expecting the default to take over. It won't. If you want to force a function to use its default value from the outside, you must pass undefined.

Another mistake is confusing default parameters with the logical OR (||) operator. Back in the day (before ES6), we used to do this:

function greet(name) {
  name = name || "World";
  console.log(Hello, ${name}!);
}

This behaves differently. The || operator checks for *any* falsy value. If you passed an empty string "" or the number 0 into this version, it would overwrite them with "World". The modern default parameter syntax (name = "World") is much safer because it only targets undefined.

Real-World Usage

In production, this distinction is critical when dealing with APIs.

Imagine you're building a function that fetches user settings. You might have a default timeout of 5000ms.

function fetchSettings(timeout = 5000) { 
  // ... fetch logic
}

If a developer calls fetchSettings(undefined), the app works fine with the 5s timeout. But if a bug in the state management passes null into that function, the timeout variable becomes null. If your internal logic then tries to do something like timeout + 1000, you're now doing math on null, which results in 1000 (because null coerces to 0). This can lead to silent failures that are a nightmare to debug.

When I'm reviewing code, I always check if a function needs to handle null explicitly. If a value can be null and you still want the default to apply, you have to handle it manually inside the function:

function greet(name = "World") {
  const finalName = name === null ? "World" : name;
  console.log(Hello, ${finalName}!);
}

Key Takeaways

- Default parameters only trigger for undefined.
- Passing no argument is the same as passing undefined.
- null is a value. It overrides the default.
- Don't confuse default parameters with falsy checks (||).
- Be explicit about whether your function should accept null or if it should be treated as "missing."