Easy to learn JavaScript-Part 1: Rest parameters in functions, javascriptrest

Source: Internet
Author: User
Tags javascript array

Easy to learn JavaScript-Part 1: Rest parameters in functions, javascriptrest

JavaScript Functions can use any number of parameters. Unlike other languages (such as C # and Java), you can pass any number of parameters when calling JavaScript functions. The JavaScript function allows an unknown number of function parameters. Before ECMAScript 6, JavaScript had a variable to access these unknown or variable target parameters. This is an object similar to an array, not an array. Think about 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 if arguments uses the length attribute and square brackets, it is not a real JavaScript array. You cannot use other JavaScript Array methods for arguments objects, such as pop, push, and slice. Some problems with 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, and slice.
  • It is very difficult to access the arguments object of an external function in an internal function. To access the file, you need to allocate the arguments function of the external function in the variable and use it in the internal function.
  • If you want to use the arguments object as an array, You need to manually convert it using transport ry. prototype. slice.

ECMAScript 6 introduces a new function, the Rest parameter, which indicates an unknown number of parameters as an array in the function. It not only represents additional parameters as arrays, but also solves many problems of the arguments object. Use the rest parameter to override the add function above.

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 the rest parameter... TheArgs or... Args. If the last name of the function parameter is... (Three points) as the prefix, then it will become the rest parameter of the function. The rest parameters of JavaScript Functions are pure JavaScript arrays. In the above Code ,... TheArgs is the rest parameter of function add, because it is a unique named parameter and... (Three vertices) as the prefix. Since the rest parameter is a JavaScript array, you can perform operations such as push and pop 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 parameters of JavaScript Functions can also work with other parameters. If you do not want to include specific parameters in the rest parameter array, you may need to use other named parameters in the function. Think about the following code blocks:

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 nth function calls, 6 and 9 are allocated to num1 and num2 respectively. For the second function call, 7 and 56 are allocated to num1 and num2. Parameters that start the third parameter will be allocated to the rest parameter array. Remember that the first two parameters are not part of the rest parameter array. Therefore, if you want to include all values in rest parameters, you should define them as comma-separated named parameters at the beginning. The following code will cause errors:

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.

Image

JavaScript allows you to break the rest parameter, which means you can unpack the rest variable data into different variable names. See 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);

When the nth function is called, a = 6, B = undefined, c = undefined will be allocated. If the second function is called, a = 7, B = 56, c = 9 will be allocated. In this example, the function ignores any additional parameters passed.

The rest parameter of the JavaScript function is a huge improvement for the arguments object to use unknown parameters of the function. It is a pure JavaScript array; therefore, you can use all array methods for it. You can decompress the rest variable data to the named variable. You can specify any name for the rest parameter, which is a major improvement in using the arguments keyword.

Join the study exchange group 569772982 to learn and exchange.

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.