JavaScript Default Parameters: Set Optional Function Argument Values

By the end of this page, you will understand how default parameters work in JavaScript, when they are used, and how they differ from older ways of setting fallback values. You will also see practical examples, common mistakes, and how this pattern appears in real codebases.

JavaScript supports default parameters, which let you assign a fallback value to a function parameter directly in the function definition.

function readFile(file, deleteAfter = false) {
  // code
}

In this example:

• file is a normal required parameter.
• deleteAfter is optional.
• If the caller does not provide deleteAfter, JavaScript uses false.

This matters because functions often need:

• required inputs for essential work
• optional inputs for customization

Default parameters make that behavior clear and readable. They also avoid extra setup code inside the function.

Before default parameters were added to JavaScript, developers often used patterns like this:

function readFile(file, deleteAfter) {
  deleteAfter = deleteAfter || false;
}

That older approach can be misleading because it treats some valid values, such as 0, "", or false, as if they were missing. Default parameters are safer because they only apply when the argument is undefined.

So yes: modern JavaScript can do what Ruby does here, and your example is valid JavaScript.

Think of a function parameter like a form field with a pre-filled value.

• If the user leaves the field blank, the pre-filled value stays.
• If the user types something, that new value is used instead.

Default parameters work the same way:

• no value passed -> use the default
• value passed -> use the passed value

A key detail: in JavaScript, the default is used when the argument is undefined.

So this:

readFile("notes.txt");

uses the default.

And this:

readFile("notes.txt", true);

uses true instead of the default.

The basic syntax is:

function functionName(parameter = defaultValue) {
  // code
}

Example 1: Simple default value

function greet(name = "Guest") {
  console.log(`Hello, ${name}`);
}

greet();
greet("Ava");

Output:

Hello, Guest
Hello, Ava

If no argument is passed, name becomes "Guest".

Example 2: Multiple parameters

function createUser(username, isAdmin = false, theme = "light") {
  return {
    username,
    isAdmin,
    theme
  };
}

console.log(createUser("sam"));
console.log(createUser("lee", true, "dark"));

Example 3: Default used only for undefined

function logMessage(message = "Default message") {
  console.log(message);
}

logMessage();
logMessage(undefined);
logMessage(null);

Output:

Default message
Default message
null

This is important:

• undefined triggers the default
• null does not trigger the default

Example 4: Your original case

function readFile(file, deleteAfter = false) {
  console.log(`Reading ${file}`);
  console.log(`Delete after reading: ${deleteAfter}`);
}

readFile("report.txt");
readFile("report.txt", true);

This is valid modern JavaScript and is the recommended way to define optional parameters with defaults.

Consider this example:

function multiply(number, factor = 2) {
  return number * factor;
}

console.log(multiply(5));
console.log(multiply(5, 3));

Step-by-step

Call 1

multiply(5)

1. number receives 5
2. factor is not provided
3. Because factor is undefined, JavaScript uses the default value 2
4. The function returns 5 * 2
5. Result: 10

Call 2

multiply(5, 3)

1. number receives 5
2. factor receives 3
3. Since a value was provided, the default is ignored
4. The function returns 5 * 3
5. Result: 15

Important trace example

function show(value = "fallback") {
  console.log(value);
}

show(false);
show(0);
show("");
show(undefined);

What happens:

• show(false) prints false
• show(0) prints 0
• show("") prints an empty string
• show(undefined) prints fallback

This shows that default parameters do not replace all falsy values. They only replace undefined.

Default parameters are common in real programs whenever a function has sensible fallback behavior.

1. API request helpers

function fetchUsers(limit = 10, includeInactive = false) {
  // build request
}

Useful when most requests use standard settings.

2. UI components

function createButton(label, type = "primary") {
  // render button
}

A component can have a default style unless another one is provided.

3. Logging utilities

function log(message, level = "info") {
  console.log(`[${level}] ${message}`);
}

Most logs may be info, but some can be warn or error.

4. File or data processing

function parseCsv(text, separator = ",") {
  // parse rows
}

The function works with common defaults but still allows customization.

5. Pagination

function listProducts(page = 1, pageSize = 20) {
  // query database or API
}

This keeps calling code simple for the common case.

In real projects, default parameters are often combined with patterns that keep functions predictable and easy to use.

Guard clauses

Developers often use defaults together with early validation.

function saveUser(user, shouldValidate = true) {
  if (!user) {
    throw new Error("User is required");
  }

  if (shouldValidate && !user.name) {
    throw new Error("Name is required");
  }

  // save user
}

Configuration objects

When a function has many optional settings, teams often use an options object.

function connect(url, options = {}) {
  const { timeout = 5000, retries = 3 } = options;
  return { url, timeout, retries };
}

This scales better than many positional parameters.

Error handling defaults

function parseJson(text, fallbackValue = null) {
  try {
    return JSON.parse(text);
  } catch {
    return fallbackValue;
  }
}

Feature flags and behavior toggles

function renderProfile(user, showEmail = false) {
  return showEmail ? `${user.name} - ${user.email}` : user.name;
}

Why teams like this pattern

• makes function behavior obvious
• reduces repetitive setup code
• documents optional behavior directly in the signature
• avoids bugs caused by older || fallback tricks

1. Confusing undefined with null

Default parameters apply only when the argument is undefined.

function greet(name = "Guest") {
  console.log(name);
}

greet(null); // prints null

If you want null to also use a fallback, handle that manually.

function greet(name = "Guest") {
  if (name === null) {
    name = "Guest";
  }
  console.log(name);
}

2. Using || instead of true default parameters

Broken approach:

function setVolume(volume) {
  volume = volume || 50;
  return volume;
}

console.log(setVolume(0)); // returns 50, which is wrong

Why it breaks:

• 0 is falsy
• || replaces it even though it is a valid value

Better:

function setVolume(volume = 50) {
  return volume;
}

console.log(setVolume(0)); // returns 0

3. Putting too many optional positional parameters

This becomes hard to read:

function createReport(name, format = "pdf", compressed = false, includeCharts = true, sendEmail = false) {
  // code
}

If a function has many optional settings, prefer an options object.

function createReport(name, options = {}) {
  const {
    format = "pdf",
    compressed = false,
    includeCharts = true,
    sendEmail = false
  } = options;
}

4. Assuming old JavaScript environments support this syntax

Default parameters are part of modern JavaScript. Very old environments may not support them without transpiling.

5. Forgetting that defaults can use earlier parameters

This is valid:

function greet(name, message = `Hello, ${name}`) {
  console.log(message);
}

But beginners may not realize the order matters. A later parameter can use an earlier one.

Default parameters vs ||

function a(value = 10) {
  return value;
}

function b(value) {
  return value || 10;
}

console.log(a(0)); // 0
console.log(b(0)); // 10

Default parameters vs ??

function withDefault(value = 10) {
  return value;
}

function withNullish(value) {
  return value ?? 10;
}

console.log(withDefault(null)); // null
console.log(withNullish(null)); // 10

Use this comparison to remember:

• default parameter -> only for undefined
• ?? -> for null or undefined
• || -> for any falsy value

Basic syntax

function greet(name = "Guest") {
  console.log(name);
}

Key rule

Default parameters are used only when the argument is:

undefined

Examples

greet();            // "Guest"
greet(undefined);   // "Guest"
greet("Sam");      // "Sam"
greet(null);        // null

Old alternative

function greet(name) {
  if (name === undefined) {
    name = "Guest";
  }
}

Avoid this when falsy values are valid

name = name || "Guest";

It wrongly replaces values like:

• 0
• false
• ""

Use earlier parameters in later defaults

function hello(name, message = `Hello, ${name}`) {
  console.log(message);
}

Many optional settings

Prefer an options object:

function connect(url, options = {}) {
  const { timeout = 5000 } = options;
}

Best practice

• use default parameters for simple optional values
• use options objects for many optional settings
• remember null does not trigger the default

Does JavaScript support default parameter values?

Yes. Modern JavaScript allows you to assign default values directly in the function parameter list.

When is a JavaScript default parameter used?

It is used when the argument is undefined, including when no argument is passed.

Does null trigger a default parameter in JavaScript?

No. If you pass null, JavaScript uses null, not the default value.

What is the difference between default parameters and ||?

Default parameters only replace undefined. || replaces any falsy value, such as 0, false, or "".

Can I use one parameter to build the default for another?

Yes. A later parameter can use an earlier one in its default value.

function greet(name, message = `Hello, ${name}`) {
  console.log(message);
}

Should I use default parameters or an options object?

Use default parameters for a small number of optional values. Use an options object when there are many optional settings.

Is function readFile(file, deleteAfter = false) valid JavaScript?

Yes. In modern JavaScript, that syntax is valid and commonly used.

• Function parameters — Default parameters build directly on how functions receive arguments.
• Arguments vs parameters — Helps clarify the difference between values passed in and names defined in the function.
• Undefined in JavaScript — Important because defaults activate when a parameter is undefined.
• Null in JavaScript — Useful for understanding why null does not trigger a default parameter.
• Logical OR (||) — Often used as an older fallback pattern, but behaves differently.
• Nullish coalescing (??) — A modern fallback operator that handles null and undefined.
• Destructuring — Commonly used with default values in options objects.
• Arrow functions — Arrow functions can also use default parameters with the same rules.