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

This article mainly explains the "es6 arrow function when can not be used", the article explains the content is simple and clear, easy to learn and understand, the following please follow the editor's ideas slowly in-depth, together to study and learn "es6 arrow function when can not be used" it!

In es6, the arrow function cannot be used in computed; because the this point in the arrow function is context-based, and the this of the arrow function in computed points to window, the data cannot appear, so the arrow function cannot be used in computed.

This tutorial operating environment: windows10 system, ECMAScript version 6. 0, Dell G3 computer.

Where the es6 Arrow function cannot be used

The this in the arrow function is based on the context. Use the arrow function in computed. Because the corresponding content cannot be found, the this will point to window and the data cannot appear.

Examples are as follows:

Calculation cache

{{name}}

New Vue ({el: "# app", data: {firstName: "Zheng", lastName: "yifeng"}, / / the arrow function cannot be used for calculating properties. The this of the arrow function points to windowcomputed: {name () {return this.firstName+this.lastName} / / this = > window// name: () = > console.log (this)}}).

Expand knowledge:

Arrow function has its convenience and advantages, but it also has disadvantages. Its advantage is that the code is concise and this is defined in advance, but its disadvantages are also these. For example, the code is too concise, which makes it difficult to read, and this is defined in advance, which leads to the inability to use js to do some operations that seem to be very normal in es5. In view of these shortcomings, let me summarize when the arrow function should not be used.

Define a function on an object

Define a function on a prototype

Callback function in dynamic context

In the constructor

A function that is too short (difficult to understand)

There is no doubt that the arrow function brings a lot of convenience. The proper use of the arrow function allows us to avoid using the earlier .bind () function or where the context needs to be fixed and makes the code more concise.

The arrow function also has some inconveniences. We can't use arrow functions where we need dynamic context: defining functions that require dynamic context, constructors, callbacks that require this objects as targets, and statements that are difficult to understand with arrow functions. In other cases, please feel free to use the arrow function.

Thank you for your reading, the above is the "es6 arrow function when can not be used" content, after the study of this article, I believe you can not use the es6 arrow function when this problem has a deeper understanding, the specific use of the situation also needs to be verified in practice. Here is, the editor will push for you more related knowledge points of the article, welcome to follow!

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.