es5 と es6 の継承の違いは何ですか

es5 と es6 の継承の違いは次のとおりです: es5 は最初にサブクラスを作成し、親クラスをインスタンス化し、それをサブクラスに追加して継承を実現します。一方、es6 は最初に親クラスを作成し、呼び出しによってサブクラスをインスタンス化します。 super メソッドは親クラスにアクセスした後、これを変更することで継承を実装します。

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

ES5 と es6 の継承の違いは何ですか

ES5 の継承では、基本的に最初にサブクラスのインスタンス オブジェクトを作成し、次に親クラスのメソッドをこれに追加します (Parent.apply) ( this)).

ES6 の継承メカニズムはまったく異なり、本質的には、親クラスのインスタンス オブジェクト this が最初に作成されます (したがって、親クラスの super() メソッドを最初に呼び出す必要があります)。 , するとサブクラスのコンストラクターが使用されるのでこれを修正します。

ES5 の継承は、プロトタイプまたはコンストラクターのメカニズムを通じて実装されます。

ES6 は、コンストラクター メソッドを持つ class キーワードを通じてクラスを定義し、クラス間の継承は extends キーワードを通じて実現されます。サブクラスはコンストラクター メソッドでスーパー メソッドを呼び出す必要があります。そうしないと、新しいインスタンスの作成時にエラーが報告されます。サブクラスは独自の this オブジェクトを持たず、親クラスの this オブジェクトを継承して処理するためです。スーパー メソッドが呼び出されない場合、サブクラスは this オブジェクトを取得できません。

ES6 での継承

従来の JS では、コンストラクターを作成し、生成されたオブジェクト

function parent(a,b){
    this.a = a;
    this.b = b;
}

を定義して追加することによってオブジェクトが生成されます。それをプロトタイプを通して必要なメソッドや属性に対応させる

parent.prototype.methods = function(){
    return 'this is test methods';
}
parent.prototype.attr = 'this is test attr‘;

そしてES6ではクラス、つまりクラスという概念が導入されました。オブジェクトはキーワード クラスを通じて定義されます。

クラスは、作成されたオブジェクトをより明確に理解できるように、キーワード、言語シュガーです。

コントロール メソッドによって渡されるパラメーターを受け取るには、属性コンストラクターを使用します。この属性を記述します。デフォルトはパラメータなしです

class parent{
    curstructor(a,b){
        this.a = a;
        this.b = b;
    }
}

ES6 の継承はクラス間の継承に基づいています。これは、キーワード extends によって実現されます。

スーパー インスタンス化による親クラスの呼び出し

class parent{
　　constructor(a,b){
　　　　this.a = a;
　　　　this.b = b;
　　}
　　parentMethods(){
　　　　return this.a + this.b
　　}
}
class child extends parent{
　　constructor(a,b,c){
　　　　super(a,b);
　　　　this.c = c;
　　}
　　childMethods(){
　　　　return this.c + ',' + super.parentMethods()
　　}
}
const point = new child(1,2,3);
alert(point.childMethods());

上記のコードは、ES6 の親子クラス継承の単純なセットです。

ご覧になったことがあると思いますが、明らかな違いは、ES6 では、新しいインスタンス化を作成するのではなく、親コンポーネントをアクティブにするスーパー メソッドであることです。つまり、親のインスタンス オブジェクトです。最初にクラスが作成されるので、呼び出し後、サブクラスのコンストラクター内でこれを変更してプロトタイプ オブジェクトを完成させます。

概要:

ES5 と ES6 の継承の最大の違いは次のとおりです:

1. ES5 は最初にサブクラスを作成し、次に親クラスをインスタンス化します。この

をサブクラスに追加します。 2.ES6 は最初に親クラスを作成し、インスタンス化されたサブセット内のスーパー メソッドを呼び出して親にアクセスした後、この

を変更することで継承を実現します。 [関連する推奨事項: JavaScript ビデオ チュートリアル 、Web フロントエンド ]

以上がes5 と es6 の継承の違いは何ですかの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。