Pourquoi l'héritage de classe d'Es6 appelle-t-il super ?

Raison : Le constructeur dérivé ne créera pas de nouvel objet this, c'est-à-dire que la sous-classe n'a pas son propre this ; ce n'est qu'après que l'objet this créé par la classe de base (classe parent) via super() que la classe dérivée peut être comme la classe de base, les classes l'utilisent également pour générer des propriétés d'objet.

L'environnement d'exploitation de ce tutoriel : système Windows 7, ECMAScript version 6, ordinateur Dell G3.

Un point clé est souvent mentionné lors de l'apprentissage de l'héritage de classe ES6

Il y a deux exigences lorsqu'une sous-classe SubClass hérite du constructeur constructeur de la classe parent SuperClass :

• 1) Super() doit être appelé dans le constructeur.

• 2) Ceci doit être écrit après super().

Le premier point est de résoudre l'ambiguïté entre la classe parent et la sous-classe, et de déterminer le concept de

"La sous-classe n'a pas son propre ce"this”这一概念

子类和父类是个相对的概念，因为一个类可以既是子类也是父类，所以ES6里用的是绝对的概念：基类和派生类。而且这个概念是针对所有构造函数说的，JS 里的构造函数要么是基的，要么就是派生的。

ES6中,我们随手写的构造函数(function)都是基类，基类可以直接用this来指向调用它所在方法的对象。

咱自己给this总结了一句话：谁调用了this，this就指向谁。

        function Super(name) {
            this.name = name；
            SuperFactory.prototype.sayHi = function () {
                console.log("Hi");
            }
        }
 
       let super = new Super("peter");//通过new创建了新的对象，Super()中的this即指向这个对象

ES6中的派生类，就是extend的class。派生出的构造函数不会创造新的<span style="background-color:#ffd900;">this</span>对象<span style="background-color:#ffd900;">(或者说this指向的对象</span>(这里可以回顾一下new关键字做的事情)，就是所说的"子类没有自己的this"。只有通过<span style="background-color:#ffd900;">super()</span>La sous-classe et la classe parent sont des concepts relatifs, car une classe peut être à la fois une sous-classe et une classe parent, donc ES6 utilise des concepts absolus : classe de base et classe dérivée. Et ce concept s'applique à tous les constructeurs. Les constructeurs en JS sont soit basiques, soit dérivés.

Dans ES6, les constructeurs (fonctions) que nous écrivons avec désinvolture sont tous des classes de base. La classe de base peut directement l'utiliser pour pointer vers l'objet qui appelle sa méthode.

Nous avons résumé cela nous-mêmes : celui qui appelle cela, cela le désignera.

 class SuperClass {                //基类 not父类
    constructor(name) {
        this.name = name;
        }
     sayHi() {
        console.log("Hi");
        }
    }；
 
class SubClass extends SuperClass {//派生类 not子类
    constructor(name，age) {
                surpe(name);
                this.age = age；
            }
    sayNo() {
        console.log("NO");
        }
    }；
        
let subinst = new subClass('tom',18);
subinst.sayHi();//Hi
subinst.sayNo();//NO

La classe dérivée dans ES6 est la classe extend.

Le constructeur dérivé ne créera pas de nouveau

<p>this</p>

object<span style="background-color:#ffd900;">(ou l'objet pointé par this</span>(Ici, vous pouvez vérifier ce que fait le nouveau mot-clé )

, qui est ce qu'on appelle "la sous-classe n'a pas son propre ceci"

Seulement en passant super() à l'objet this créé par la classe de base

, la classe dérivée peut l'utiliser pour générer les propriétés de l'objet comme la classe de base 🎜

class Person {
  constructor(name) {
    this.name = name;
  }
}
 
class PolitePerson extends Person {
  constructor(name) {
    this.greetColleagues(); // 这里不允许我们使用this,下面解释
    super(name);
  }
  greetColleagues() {
    alert('Good morning folks!');
  }
}

🎜. Alors pourquoi est-ce. Doit être écrit après super() pour éviter un piège de code 🎜

greetColleagues() {
    alert('Good morning folks!');
    alert('My name is ' + this.name + ', nice to meet you!');
  }

🎜L'exemple ci-dessus suppose que cela est autorisé avant d'appeler super(). Après un certain temps, afin de répondre à certains besoins, nous ajoutons : 🎜rrreee. dans greetColleagues(). 🎜Mais nous avons oublié que this.greetColleagues() n'est pas défini du tout avant l'appel de super(), et le code générera une erreur. Il peut être difficile de penser à quand cela se produira avec un code comme celui-ci. 🎜🎜Donc, afin d'éviter ce piège, 🎜🎜JavaScript vous oblige à appeler super avant de l'utiliser dans le constructeur 🎜🎜🎜🎜[Recommandations associées : 🎜Tutoriel vidéo javascript🎜, 🎜Vidéo de programmation🎜]🎜

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!