Function parameters

A function in JavaScript can take parameters. Parameters represent the way data is passed to the function. Parameters are specified in brackets after the function name.

For example, let’s define a simple function that takes one parameter:

function print(message){
    console.log(message);
}

print("Hello JavaScript");
print("Hello METANIT.COM");
print("Function in JavaScript");

The function print()takes one parameter – message. Therefore, when calling a function, we can pass a value for it, for example, some string:

print("Hello JavaScript");

Values ​​passed to parameters are also called arguments.

At the same time, unlike a number of other programming languages, we can, in principle, not pass values ​​to parameters. For example:

 
function print(message){
    console.log(message);
}
print();
If no value is passed to the parameter, then it will have the value undefined.

If the function takes several parameters, they are listed separated by commas:
 
function sum(a, b){
    const result = a + b;
    console.log(result);
}

sum(2, 6);          // 8
sum(4, 5);          // 9
sum(109, 11);       // 120

When calling a function with multiple parameters, the values ​​are passed to the parameters by position. That is, the first value is passed to the first parameter, the second value to the second, and so on. For example, in a call:

sum(2, 6);

The number 2 is passed to the parameter a, and the number 6 is passed to the parameter b.

Optional parameters and default values

A function can take many parameters, but some or all of the parameters may be optional. If no value is passed for parameters, they default to “undefined”. However, sometimes it is necessary that the parameters must have some values, for example, default values. Prior to the ES6 standard, it was necessary to check parameter values ​​for undefined:

function sum(x, y){

    if(y === undefined) y = 5;
    if(x === undefined) x = 8;
    const z = x + y;
    console.log(z);
}
sum();          // 13
sum(6);         // 11
sum(6, 4)       // 10

Here the function sum()takes two parameters. When calling a function, we can check their values. At the same time, when calling the function, it is not necessary to pass values ​​for these parameters. To check for the presence of a parameter value, a comparison with the value is used undefined.

We can also define default values ​​for parameters directly:

function sum(x = 8, y = 5){

    const z = x + y;
    console.log(z);
}
sum();      // 13
sum(6);     // 11
sum(6, 4)   // 10

If no values ​​are passed to the x and y parameters, then they are received as the values ​​of the number 5 and 10, respectively. This way is more concise and intuitive than comparing with undefined.

In this case, the default value of the parameter can be derived, representing the expression:

function sum(x = 8, y = 10 + x){

    const z = x + y;
    console.log(z);
}
sum();      // 26
sum(6);     // 22
sum(6, 4)   // 10

In this case, the value of the y parameter depends on the value of x.

Arguments array

If necessary, we can get all the passed parameters through the globally accessible arguments array :

function sum(){
    let result = 0;
    for(const n of arguments)
        result += n;
    console.log(result);
}
sum(6);             // 6
sum(6, 4)           // 10
sum(6, 4, 5)        // 15

At the same time, it doesn’t even matter that we didn’t specify any parameters when defining the function, we can still pass them and get their values ​​​​through the arguments array .

Undefined number of parameters

Using the … (ellipsis) operator, we can indicate that a variable number of values can be passed using a parameter:

function display(season, ...temps){
    console.log(season);
    for(index in temps){
        console.log(temps[index]);
    }
}
display("Spring", -2, -3, 4, 2, 5);
display("Summer", 20, 23, 31);

In this case, the second parameter …tempsindicates that a different number of values can be passed instead. In the function itself, temps actually represents an array of passed values ​​that we can get. At the same time, despite this, when the function is called, it is not an array that is passed to it, but individual values.

Console output:

Spring
-2
-3
4
2
5
Summer
20
23
31

as parameters

Functions can act as parameters to other functions:

function sum(x, y){
    return x + y;
}

function subtract(x, y){
    return x - y;
}

function operation(x, y, func){
 
    const result = func(x, y);
    console.log(result);
}

console.log("Sum");
operation(10, 6, sum);  // 16

console.log("Subtract");
operation(10, 6, subtract); // 4

The function operationtakes three parameters: x, y and func. func – represents a function, and at the time of defining operation, it does not matter what kind of function it will be. The only thing known is that the func function can take two parameters and return a value, which is then displayed in the browser console. Therefore, we can define various functions (such as the sum and subtract functions in this case) and pass them into the call to the operation function.