Understanding JavaScript, Rest parameters in functions

Our study or work will involve JavaScript, so we must also understand JavaScript. When it comes to rest parameters, they are a large part of the function. And functions are ever-changing. This article will help you understand and master JavaScript. Let's study it carefully.

JavaScript Functions can take any number of parameters. Unlike other languages ​​such as C# and Java, you can pass any number of arguments when calling a JavaScript function. JavaScript functions allow an unknown number of function parameters. Prior to ECMAScript 6, JavaScript had a variable to access these unknown or variable numbers of parameters, which was an array-like object, not an array. Consider the following code to understand the arguments variable:

function add(){
    var result = 0;
    for(let i=0;i<arguments.length;i++){
        result = result + arguments[i];
    }
    return result;
}
var r = add(6,9,3,2);
console.log(r);
var t = add(7,56,9);
console.log(t);

As you can see, the arguments object is used to access unknown or variable function parameters. Even though arguments uses the length attribute and square brackets, it is not a true JavaScript array. You cannot use other JavaScript array methods like pop, push, slice, etc. on the arguments object. Some problems when using arguments are:

The JavaScript function arguments object is not a real JavaScript array; therefore, you cannot use other array methods such as pop, push, slice, etc.

It is difficult to access the arguments object of an external function in internal functions. To access it, you need to assign the arguments function of the outer function in a variable and then use it in the inner function.

If you want to use the arguments object as an array, then you need to manually convert it via Aarry.prototype.slice.

ECMAScript 6 introduces a new feature, Rest parameters, which represent an unknown number of parameters as an array in a function. Not only does it represent additional parameters as arrays, it also solves many problems with arguments objects. Rewrite the add function above using the rest parameter.

function add(...theArgs){
    var result = 0;
    for(let i=0;i<theArgs.length;i++){
        result = result + theArgs[i];
    }
    return result;
}
var r = add(6,9,3,2);
console.log(r);
var t = add(7,56,9);
console.log(t);

You can define rest parameters as...theArgs or...args. If the last named function parameter is prefixed with ... (three dots), then it becomes the rest parameter of the function. The rest parameter of a JavaScript function is a pure JavaScript array. In the above code, ...theArgs is the rest parameter of the function add because it is the only named parameter and is also prefixed with ... (three dots). Since the rest parameter is a JavaScript array, you can perform operations such as push, pop, etc. on the rest parameter theArgs, as shown in the following code:

function add(...theArgs){
    theArgs.push(10);
    var result = 0;
    for(let i=0;i<theArgs.length;i++){
        result = result + theArgs[i];
    }
    var lastItem  = theArgs.pop();
    console.log(lastItem);
    return result;
}

The rest parameter of the JavaScript function can also work with other parameters. If you don't want to include specific parameters in the rest parameter array, then you may need to use other named parameters in the function. Consider the following block of code:

function add(num1, num2, ...theArgs){
    console.log(num1);
    console.log(num2);
    console.log(theArgs.length);
}
var r = add(6,9,3,2);
var t = add(7,56,9);

For the first function call, 6 and 9 will be assigned to num1 and num2 respectively. For the second function call, 7 and 56 will be assigned to num1 and num2. The parameter that starts the third parameter will be assigned to the rest parameter array. Keep in mind that the first two parameters will not be part of the rest parameter array. So, if you plan to include all values ​​in rest parameters, you should define them as comma-separated named parameters from the beginning. The code given below will result in an error:

function add(num1, ...theArgs,num2){
    console.log(num1);
    console.log(num2);
    console.log(theArgs.length);
}

In the above code, the rest parameter is not the last parameter, so JavaScript will throw an error. The rest parameter must be the last formal parameter.

JavaScript allows you to destroy rest parameters, which means you can unpack rest variable data into different variable names names. Please look at the following code:

function add(...[a,b,c]){
    return a+b+c;
}
var r = add(6);
console.log(r);
var t = add(7,56,9);
console.log(t);

The first function call will assign a = 6, b = undefined, c = undefined, and the second function call will assign a = 7, b = 56, c =9. In this example, the function will ignore any additional arguments passed.

The rest parameter of JavaScript functions is a huge improvement over the arguments object Using functions Unknown parameters. It is a pure JavaScript array; therefore, you can use all array methods on it. You can unpack rest variable data into named variables. You can give rest parameters any name, which is another major improvement over using the arguments keyword.

In the next article in the "Understanding JavaScript" series, we will introduce default parameters in JavaScript functions, so stay tuned.

Understanding JavaScript, the Rest parameter in the function, it ends here. Welcome everyone to study and discuss together:

Related reading:

Understand JavaScript and understand the let statement

Understand JavaScript, default parameters in functions

Native js implements movable Prompt div box source code

The above is the detailed content of Understanding JavaScript, Rest parameters in functions. For more information, please follow other related articles on the PHP Chinese website!