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

Most people do not understand the knowledge points of this article "how to use super in es6", so the editor summarizes the following content, detailed content, clear steps, and has a certain reference value. I hope you can get something after reading this article. Let's take a look at this "how to use super in es6" article.

The usage of super: 1, when super is used as a function, it is used to represent the constructor of the parent class, and the syntax is "constructor () {super ();}"; 2. When super is used as an object, it is used to point to the prototype object of the parent class in ordinary methods and to point to the parent class in static methods.

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

What is the use of super in es6

The first case: when super is a function, it represents the constructor of the parent class.

ES6 requires that the constructor of a subclass must execute the super function once

Class A {} class B extends A {constructor () {super (); / / the constructor of the subclass must execute the super function once, representing the constructor of the parent class}}

Note: although super represents the constructor of the parent class, the instance of B returned at this time, that is, the this within super refers to the instance of B, so super () is equivalent to A.prototype.constructor.call (this).

Class A {constructor () {console.log (new.target.name);}} class B extends A {constructor () {super ();}} new A () / / Anew B () / / B

In the above code, new.target points to the currently executing function, and when super () executes, it points to the constructor of subclass B, not the constructor of parent class A, that is, the this inside super () points to B.

When super is used as a function, it must appear in the constructor constructor of the subclass, otherwise an error will be reported.

Class A {} class B extends A {m () {super (); / / error report}}

The second case: when super is an object, in ordinary methods, point to the prototype object of the parent class, and in static methods, point to the parent class

Class A {p () {return 2;}} class B extends A {constructor () {super (); / / constructor of the parent class console.log (super.p ()); / / 2}} let b = new B ()

In the above code, when super is a function, it represents the constructor of the parent class, and when it is an object, it points to the prototype object of the parent class, that is, A.prototype, so super.p () is equivalent to A.prototype.p ().

It is also important to note that because super points to the prototype of the parent class, properties or methods on the instance of the parent class cannot be called through super

Class A {constructor () {this.p = 2;} class B extends A {get m () {return super.p;}} let b = new B (); b.m / / undefined

In the above code, p is the property of the instance of parent class A, and super.p cannot reference it.

If the property is defined on the prototype of the parent class, you can access it using super

Class A {} A.prototype.x = 2bot class B extends A {constructor () {super (); console.log (super.x) / / 2}} let b = new B ()

In the above code, the attribute x is defined on the parent class's prototype object, so you can use super.x to access the

The above is about the content of this article on "how to use super in es6". I believe we all have some understanding. I hope the content shared by the editor will be helpful to you. If you want to know more about the relevant knowledge, please pay attention to the industry information channel.

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.