Shulou(Shulou.com)05/31 Report--

This article mainly introduces "what are the characteristics of the es6 arrow function". In the daily operation, I believe that many people have doubts about the characteristics of the es6 arrow function. The editor consulted all kinds of data and sorted out a simple and easy-to-use method of operation. I hope it will be helpful for you to answer the question of "what are the characteristics of the es6 arrow function?" Next, please follow the editor to study!

The characteristics of the es6 arrow function are: 1, the arrow function has no arguments object; 2, the arguments value of the arrow function, depending on the value of the external non-arrow function, the arrow function can not change the this direction; 3, the arrow function can not be declared with the new keyword; 4, the arrow function has no prototype prototype attribute.

The operating environment of this tutorial: windows7 system, ECMAScript version 6, Dell G3 computer.

A new function has been added to the ES6 standard: Arrow Function (arrow function).

Why is it called Arrow Function (Arrow function)? Because it is defined with an arrow:

X = > x * x

The arrow function above is equivalent to:

Function (x) {return x * x;}

The arrow function is equivalent to an anonymous function and simplifies the function definition. The arrow function has two formats, one like the one above, which contains only one expression, omitting even {.} and return. There is another way that can contain multiple statements, so you can't omit {...} and return:

X = > {if (x > 0) {return x * x;} else {return-x * x;}}

If the parameter is not one, you need to enclose it in parentheses ():

/ / two parameters: (X, y) = > x * x + y * y rest / No parameter: () = > 3.14 foo / variable parameter: (x, y,... foo) = > {foo I, sum = x + y; for (iS0; I {foo: X})

Because it conflicts with the {.} of the function body, so it should be changed to:

/ / ok:x = > ({foo: X})

The characteristics of es6 Arrow function

1. The arrow function does not have arguments.

Let test1 = () = > {console.log (arguments)} test1 (123) / / arguments is not defined

The arrow function will only look for the outer layer of the non-arrow function when looking for the arguments object. If the outer layer is a non-arrow function, it will interrupt the return if it does not have an arguments object. It will not look for the outer layer.

Function test2 (a, b, c) {return () = > {console.log (arguments) / / [1]}} test2 (1) ()

2. The value of the arrow function th

The this value of the arrowhead function depends on the this value of the non-arrowhead function outside the function. If the upper layer is still the arrowhead function, then continue to look up. If you can't find it, then this is the arrow object.

Let person = {test: () = > {console.log (this)}, fn () {return () = > {console.log (this)} person.test () / / windowperson.fn () () / / person object

The arrow function cannot change the direction of the this

Let person = {} let test = () = > console.log (this) test.bind (person) () test.call (person) test.apply (person)

At the time of pre-compilation, this has determined.

3. Arrow functions cannot be declared with the new keyword

Let test = () = > {} new test () / / Uncaught TypeError: test is not a constructor

4. The arrow function has no prototype prototype attribute.

Do all functions in JavaScript have prototype attributes? this is wrong.

Let test = () = > {} test.prototype / / undefinedtest.__proto__ = Function.prototype / / true

Arrow functions cannot repeat named parameters

/ / Arrow function can not repeat named parameter let bbb = (b, b, b) = > {} / / Uncaught SyntaxError: Duplicate parameter name not allowed in this contextlet bb = function (b, b, b) {} / / es5 will not report an error here, the study on "what are the characteristics of es6 arrow function" is over, hope to solve everyone's doubts. The collocation of theory and practice can better help you learn, go and try it! If you want to continue to learn more related knowledge, please continue to follow the website, the editor will continue to work hard to bring you more practical articles!

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.