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

This article mainly introduces "what are the five functions worth mastering in JavaScript ES6". In daily operation, I believe many people have doubts about what the five functions of JavaScript ES6 are worth mastering. The editor consulted all kinds of materials and sorted out simple and easy-to-use methods of operation. I hope it will be helpful for you to answer the doubts about "what are the five functions worth mastering in JavaScript ES6?" Next, please follow the editor to study!

JavaScript ES6 adds many new features to the JavaScript language, some of which are more groundbreaking and widely used than others. Things like ES6 Classes, while novel, simply add syntactic sugar to existing methods to create classes in JavaScript, while features like Generators, while powerful, are reserved for more professional tasks.

1) JavaScript Arrow function

One of my favorite new features in ES6 JavaScript is not a new feature, but a refreshing new grammar set that smiles on my face every time I use it. I'm talking about the Arrow function, which provides an extremely elegant and minimalist way to define anonymous functions in JavaScript.

In short, the Arrow function removes the "function" keyword and uses the arrow (= >) to separate the argument part of the function from the function BODY of the anonymous function:

one

(XBI y) = > x * y

This is equivalent to:

one

two

three

Function (XBI y) {

Return x * y

}

Or:

one

two

three

four

(XBI y) = > {

Var factor = 5

Var growth = (xy) * factor

}

This is similar to:

one

two

three

four

Function (XBI y) {

Var factor = 5

Var growth = (xy) * factor

}

When using traditional anonymous functions, the arrow function also removes the key source of the error, which is the value of the "" object inside the this function. Using the arrow function, "this" is lexically bound, which is just a way of saying that its value is bound to the parent scope and never changes. If the arrow function is defined in the custom object "", the value this of "countup" points to "countup"-there is no need to guess. For example:

one

two

three

four

five

six

seven

eight

nine

ten

eleven

Var countup = {

Counter: 15

Start: function () {

Window.addEventListener ('click', ()) = > {

Alert (this.counter) / / correct warning due to lexical binding 15

})

}

}

Countup.start ()

Compare it with traditional anonymous functions, where the value of "this" varies according to the context in which it is defined. The result of this.counter 's attempt to reference in the above case will return undefined, which may confuse many unfamiliar dynamic and intricate behavior bundles. With the arrow feature, the value of "this" is always predictable and easy to infer.

At this point, the study of "what are the five functions of JavaScript ES6 worth mastering" is over. I hope to be able to solve your 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.