JS using apply, BIND implementation as a function or class to pass in the dynamic number of parameters

Source: Internet
Author: User

To commemorate 10 years without blogging, the first blog post begins with such an interesting trick-___-

In ES5, when we call a function, if the parameter to be passed is generated based on other functions or conditions, that is, how many arguments will be passed, how do you do it without changing the original function?

(Of course, avoid the situation as described above, such as changing the parameter to object or array, etc.)

Most people may know that using apply can solve this problem perfectly:

Apply and call will use the first parameter as the calling object of the function, that is, overwrite the this pointer within the calling function as the first parameter, and if it is not a method of the object, you can pass in a null without considering this.

And the difference is that the arguments in the following, apply will all the arguments to pass in the calling function in an array, call is the same as the original function appended in sequence.

Since it is an array, it can be controlled, according to other functions or logical judgments to generate an array, you can achieve the purpose of passing in the dynamic number of parameters.

But I have a headache problem, to pass in a dynamic parameter when I create an object with new, only a few years have encountered a problem:

If you are using ES6 and have rest parameters, none of the above issues is a problem. Note that the array args preceded by three points is not a syntax error, but rather the rest parameter notation provided by ES6, which you can understand to replace the ... args with the args array by removing the characters after the square brackets.

But ES5 there really is no way to achieve it? After all, ES6 are mostly grammatical sugars, can be compiled with Babel a class of tools to ES5, with doubt, we will use Babel compile a look to get what:

See the last line stunned, don't be afraid, let us analyze this code. First dismembered, divided into three steps to see:

1. There is no doubt that using CONCAT to concatenate null with our parameters as an array, as apply the second parameter, that is, get [null, 1, 2, 3];

2. Let's calculate apply, the first parameter Foo will replace the function to invoke the native bind method, the contents of the second parameter array will be passed as bind parameters, that is, get Foo.bind (null, 1, 2, 3);

3. Bind method The first parameter is similar to apply, call, modify the this pointer, and the following parameters can be inserted into the function of the default pre-parameter values (preset leading argument), That is, when BIND is executed, in the first set of parentheses we get a Foo class that has injected three parameter values, called Foowithargs;

Finally, when we new Foowithargs (); , you do not have to pass in any parameters. Equivalent to New Foo (1, 2, 3);

amazing!

JS using apply, BIND implementation as a function or class to pass in the dynamic number of parameters

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.