Shulou(Shulou.com)06/02 Report--

This article mainly explains "JavaScript arrow function and how to use the remaining parameters", interested friends may wish to have a look. The method introduced in this paper is simple, fast and practical. Let's let the editor take you to learn how to use the JavaScript arrow function and the remaining parameters.

1.   what is the arrowhead function?

Arrow function expression syntax is more concise than function expression, that is, a simplified form of function.

It is written as follows:

() = > {}; / / can be used to write an anonymous function

Its structure:

Const / let function name parameter = > function body

For example, there is a general form of function expression.

Let add = function (x, y) {return x + y;}

You can use the arrow function to write:

Let add = (x, y) = > {return x + y;}; 2. The simplified Writing method of Arrow function

Single parameter

/ / for a single parameter, we can omit the parentheses let addOne = x = > {return x + 1;}

One-line function body

/ / for a single line to return the function body, you can omit both {} and returnlet add (x, y) = > x + y

Single-line object

/ / for the returned one-line object, add () let add (x, y) = > ({value: X + y;}); 3. The basics of the   arrow function

The arrow function does not have this, it looks for this in the outer layer based on the scope chain.

For example:

Var A = 1 this.A fun = {A: 2, printA: () = > {console.log (this.A);}, printAA: function () {let print = () = > {console.log (this.A);} print ();}}; fun.printA (); / / 1fun.printAA (); / / 2

Call printA, inside is the output this.A, because the arrow function does not have this, so look in the outer layer, the outer layer is fun. In this case, fun.printA () is called in the global scope, so the outer this points to window, and since an A = 1 was defined with var, the output is 1.

Call printAA, call print () inside, output this.A, look at the print function, it is an arrow function, it does not have this, so look for the outer layer, its outer layer is printAA, it is called by fun, so its this points to fun, so output the A defined in fun, which is 2.

4. Scenarios where the arrow function is not applicable

As a constructor

After instantiating the constructor, its this points to the instantiated object, while the arrow function does not have a this, so it cannot be used as a constructor.

When you need a this to point to the calling object

When you need to use arguments

There is no arguments in the arrow function, so you can use the remaining parameters to store the parameters.

5.   remaining parameters 5.1) what are the remaining parameters?

For example:

Let add = (x, y, z,... args) = > {console.log (x, y, z, args);}

Args is the remaining parameter.

The remaining parameter is an array that exists in the form of an empty array, even if it has no value.

For example:

Let add = (x, y, z,... args) = > {console.log (x, y, z, args);} add (1,2,3)

X, y, z correspond to parameters 1, 2, 3. Since the remaining parameters have no value, an empty array exists.

5.2) function

Since the arrow function does not have arguments, we can use the remaining parameters instead of arguments to get the actual parameters

For example:

Const print = (... args) = > {console.log (args);}; print (1,2)

5.3) considerations

In the arrow function, parentheses cannot be omitted even if there is only one remaining argument

Let add = (... args) = > {}

The remaining parameter can only be the last parameter, and then there can be no other parameters, otherwise an error will be reported.

At this point, I believe that everyone on the "JavaScript arrow function and how to use the remaining parameters" have a deeper understanding, might as well to the actual operation of it! Here is the website, more related content can enter the relevant channels to inquire, follow us, continue to learn!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.