Using apply and bind in JS to input a dynamic number of parameters for a function or class _ javascript skills

This article describes how to use apply and bind in JS to input dynamic numbers of parameters for functions or classes. If you need to write a blog for 10 years, refer to this article, in the first blog post, let's start with such an interesting trick -___-

In ES5, when we call a function, if the parameter to be passed in is determined based on other functions or conditions, that is, we are not sure how many parameters will be passed in, what should I do without changing the original function?

(Of course, we can avoid the situation described in this article, for example, changing the parameter to object or array)

Most people may know that applying can solve this problem perfectly:

Like call, apply uses the first parameter as the call object of the function. That is, the this pointer in the call function is rewritten as the first parameter. If it is not an object method, you can ignore this, enter a null value.

The difference lies in the following parameters. apply puts all parameters that need to be passed in to the called function in an array, and the call is appended in sequence like the original function.

Since it is an array, It is controllable. An array is generated based on other functions or logic judgment, which can pass in the dynamic number parameter.

However, I encountered a headache. I had to input a dynamic parameter when I used new to create an object. This problem occurred only a few years ago:

If ES6 is used and the rest parameter is used, all the above problems are not a problem. Note: adding three vertices before the array args is not a syntax error, but the rest parameter writing provided by ES6... replace args with the characters After square brackets in The args array.

But is there really no way to implement it in ES5? After all, most of ES6 is syntactic sugar. You can use tools like babel to compile ES5. with questions, let's compile it with babel to see what we get:

Let's analyze the code. First, you can dismember the database in three steps:

1. There is no doubt that concat is used to connect null to our parameter into an array and use it as the second parameter of apply, that is, [null, 1, 2, 3] is obtained;

2. let's calculate apply. The first parameter Foo will replace Function to call the native bind method. The content of the second parameter array will be passed in as the bind parameter to get Foo. bind (null, 1, 2, 3 );

3. the first parameter of the bind method is similar to apply and call. Modify the this pointer. The following parameter can be used to insert the default preset leading argument value to the function ), that is to say, after the bind is executed, we get a Foo class with three parameter values injected in the first group of parentheses. It is also called FooWithArgs;

In the end, when we use new FooWithArgs ();, no parameters are required. Equivalent to new Foo (1, 2, 3 );