Explication détaillée du super mot-clé dans la classe ES6

Le super mot-clé de la classe ES6 a été collecté et organisé. Cet article sera partagé avec tout le monde. Il est très bon et a une valeur de référence. J'espère qu'il pourra aider tout le monde.

Ce qui suit ne sont que des notes d'étude personnelles :

Le mot-clé super peut être utilisé soit comme fonction, soit comme objet. Dans les deux cas, son utilisation est complètement différente.

1. Utilisez-le comme une fonction

class A {}
class B extends A {
 constructor() {
  super(); //ES6 要求，子类的构造函数必须执行一次super函数。
 }
}

Notez que bien que super représente le constructeur de la classe parent A, Quoi est renvoyé est une instance de la sous-classe B, c'est-à-dire que this inside super fait référence à B, donc super() est équivalent à A.prototype.constructor.call(this) ici.

class A {
 constructor() {
  console.log(new.target.name); //new.target指向当前正在执行的函数
 }
}
class B extends A {
 constructor() {
  super();
 }
}
new A() // A
new B() // B

Vous pouvez voir que lorsque super() est exécuté, il pointe vers le constructeur de la sous-classe B, pas le constructeur de la classe parent A. En d’autres termes, cela à l’intérieur de super() pointe vers B.

2. Utilisez-le comme objet

Dans les méthodes ordinaires, il pointe vers l'objet prototype de la classe parent ; dans les méthodes statiques, il pointe vers la classe parent ; .

class A {
 c() {
  return 2;
 }
}
class B extends A {
 constructor() {
  super();
  console.log(super.c()); // 2
 }
}
let b = new B();

Dans le code ci-dessus, super.c() dans la sous-classe B utilise super comme objet. À l'heure actuelle, super pointe vers A.prototype dans la méthode ordinaire, donc super.c() est équivalent à A.prototype.c().

Lors de l'appel de la méthode de la classe parent via super, super liera celle de la sous-classe.

class A {
 constructor() {
  this.x = 1;
 }
 s() {
  console.log(this.x);
 }
}
class B extends A {
 constructor() {
  super();
  this.x = 2;
 }
 m() {
  super.s();
 }
}
let b = new B();
b.m() // 2

Dans le code ci-dessus, bien que super.s() appelle A.prototype.s(), A.prototype.s() liera This de la sous-classe B fait que la sortie est 2 au lieu de 1. En d’autres termes, ce qui est réellement exécuté est super.s.call(this).

Puisque ceci est lié à la sous-classe, si une propriété se voit attribuer une valeur via super, alors super est-ce, et la propriété attribuée deviendra la propriété de l'instance de sous-classe.

class A {
 constructor() {
  this.x = 1;
 }
}
class B extends A {
 constructor() {
  super();
  this.x = 2;
  super.x = 3;
  console.log(super.x); // undefined
  console.log(this.x); // 3
 }
}
let b = new B();

Dans le code ci-dessus, super.x se voit attribuer une valeur de 3, ce qui équivaut à attribuer une valeur de 3 à this.x. Lors de la lecture de super.x, A.prototype.x est lu, donc undefined est renvoyé.

Notez que lors de l'utilisation de super, vous devez spécifier explicitement si vous souhaitez l'utiliser comme fonction ou comme objet, sinon une erreur sera signalée.

class A {}
class B extends A {
 constructor() {
  super();
  console.log(super); // 报错
 }
}

Dans le code ci-dessus, le super dans console.log(super) ne peut pas être vu s'il est utilisé comme fonction ou comme objet, donc le JavaScript le moteur analyse le code signalera une erreur. À l'heure actuelle, si le type de données du super peut être clairement indiqué, aucune erreur ne sera signalée.

Enfin, puisque les objets héritent toujours d'autres objets, vous pouvez utiliser le mot-clé super dans n'importe quel objet.

Recommandations associées :

Explication détaillée de la méthode de Laravel pour implémenter un superviseur pour exécuter des processus asynchrones

Explication détaillée du super () fonction en python Utilisation et principe de fonctionnement

Détails de l'appel de super en héritage multiple

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!