es6 のクラス継承で super が呼び出されるのはなぜですか?

理由: 派生コンストラクターは新しい this オブジェクトを作成しません、つまり、サブクラスには独自の this はなく、基底クラス (親クラス) によって super() を通じて作成された this オブジェクトのみが含まれます。派生クラスはこれを使用して、基本クラスと同様にオブジェクト プロパティを生成できます。

このチュートリアルの動作環境: Windows 7 システム、ECMAScript バージョン 6、Dell G3 コンピューター。

ES6 クラスの継承を学習する際によく言及される重要なポイント

サブクラス SubClass が親クラス SuperClass のコンストラクター コンストラクターを継承する場合、次の 2 つの要件があります。

• #1) Super() はコンストラクター内で呼び出す必要があります。

• 2) これは super() の後に記述する必要があります。

最初のポイントは、親クラスとサブクラスの間のあいまいさを解決することです。

「サブクラスは、独自の

this”この概念

サブクラスと親クラスは相対的な概念です。クラスはサブクラスにも親クラスにもなり得るため、ES6 では基本クラスと派生という絶対的な概念を使用します。クラス。この概念はすべてのコンストラクターに適用され、JS のコンストラクターは基本コンストラクターまたは派生コンストラクターのいずれかです。

ES6 では、私たちが何気なく書いているコンストラクター (関数) はすべて基底クラスであり、基底クラスはこれを直接使用して、そのメソッドを呼び出すオブジェクトを指すことができます。

これを次のように要約しました。誰がこれを呼び出しても、これは次のことを指します。

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

ES6 の派生クラスは extend クラスです。

派生コンストラクターは、新しい this<span style="background-color:#ffd900;"></span> オブジェクト (または this が Object# を指す) を作成しません。 <span style="background-color:#ffd900;"></span>(ここで新しいキーワードの動作を確認できます##)、いわゆる「サブクラスには独自の this がありません」です。super()<span style="background-color:#ffd900;"> 基底クラスによってこのオブジェクトが作成された後のみ </span>、派生クラスはこれを使用して基底クラスと同様に生成できます。

 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

では、これを super() の後に記述する必要がある理由

は、コード トラップを避けるためです。

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

上の例では、super() の前に次のことが想定されています。しばらくして、いくつかのニーズを満たすために、greetColleagues():

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

を追加しましたが、以前は this.greetColleagues() がまったく存在しなかったことを忘れていました。 super() が呼び出されました。定義すると、コードはエラーをスローしますが、このようなコードでエラーが発生する場合を考えるのは難しいかもしれません。

したがって、このトラップを回避するには、

JavaScript では、コンストラクターでこれを使用する前に、最初に super を呼び出す必要があります。

[関連する推奨事項: JavaScript ビデオ チュートリアル

、

プログラミング ビデオ]

以上がes6 のクラス継承で super が呼び出されるのはなぜですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。