Declare Optional Function Parameters in JavaScript

Optional parameters allow a JavaScript function to work even when some arguments are not provided. They make functions more flexible and reusable.

• Missing parameters have the value undefined unless a default value is provided.
• Default values can be assigned directly in the function definition.
• Rest parameters can handle a variable number of arguments.
• Optional parameters are generally placed after required parameters.

The following approaches can be used to declare and handle optional function parameters in JavaScript.

Approach 1: Using the Logical OR (||) Operator

The logical OR (||) operator can be used to provide a fallback value for a parameter. If the parameter is undefined or another falsy value, the default value is used.

function check(a, b) {
    b = b || 0;

    console.log(
        "Value of a is: " + a +
        " Value of b is: " + b
    );
}

check(5, 3);
check(10);

Value of a is: 5 Value of b is: 3
Value of a is: 10 Value of b is: 0

Syntax:

function myFunc(a, b) {
    b = b || 0;

    // function body
}

Note: The || operator uses the default value for any falsy value such as 0, false, "", null, or undefined. If you only want to provide a value when the parameter is undefined or missing, use default parameters or the ?? operator instead.

Approach 2: Using Default Parameters

JavaScript allows you to assign a default value directly in the function parameter list. If the argument is not provided, the default value is automatically used.

function check(a, b = 0) {
    console.log(
        "Value of a is: " + a +
        " Value of b is: " + b
    );
}

check(9, 10);
check(1);

Value of a is: 9 Value of b is: 10
Value of a is: 1 Value of b is: 0

Syntax:

function myFunc(a, b = 0) {
    // function body
}

• a is a required parameter.
• b = 0 defines 0 as the default value for b.
• When b is omitted, JavaScript uses 0.
• When a value is provided, that value is used instead.

Approach 3: Using the arguments Object

The arguments object contains all arguments passed to a regular function. Its length property can be used to determine how many arguments were provided.

function gfg(a, b) {

    // No arguments are passed
    if (arguments.length === 0) {
        a = "hello";
        b = "geeks";
    }

    // Only one argument is passed
    if (arguments.length === 1) {
        b = "geeks";
    }

    return a + b;
}

console.log(gfg("hey"));

heygeeks

• arguments.length returns the number of arguments passed to the function.
• When only one argument is passed, b is assigned "geeks".
• This approach can be useful when different behavior is required based on the number of arguments.

Approach 4: Using Rest Parameters

The rest parameter (...rest) collects additional arguments into an array. It can be used when a function needs to accept a variable number of arguments.

function check(a, ...rest) {
    let b = rest.length > 0 ? rest[0] : 0;

    console.log(
        `Value of a is: ${a} Value of b is: ${b}`
    );
}

// Calling with both parameters
check(5, 3);

// Calling with only the first parameter
check(10);

// Calling with more than two parameters
check(1, 2, 3);

Value of a is: 5 Value of b is: 3
Value of a is: 10 Value of b is: 0
Value of a is: 1 Value of b is: 2

Syntax:

function myFunc(a, ...rest) {
    // function body
}

• a receives the first argument.
• ...rest collects all remaining arguments into an array.
• rest.length can be used to check whether additional arguments were provided.
• This approach is useful when the number of optional arguments is not fixed.