ES6 でクラスの知識ポイントを要約して整理する

この記事では、javascript に関する関連知識を提供します。主にクラス class に関する関連問題を紹介します。ES6 ではクラス class の概念が導入され、クラスは class キーワードを通じて定義できます。これはオブジェクトです私たちが通常理解しているものにより近い、 - 指向の言語です。見てみましょう。皆さんのお役に立てれば幸いです。

[関連する推奨事項: JavaScript ビデオ チュートリアル、Web フロントエンド]

クラスの紹介

従来の JS には、クラスではなくオブジェクトの概念しかありません。これは、JS がプロトタイプに基づくオブジェクト指向言語であり、プロトタイプ オブジェクトの特性がすべてのプロパティを新しいオブジェクトと共有することであるためです。

ES6 では、クラスの概念が導入されています。クラスは、class キーワードを通じて定義できます。これは、私たちが通常理解しているものにより近いオブジェクト指向言語です。

class Person{   //定义一个名为Person的类
    // 构造函数，用来接受参数
    constructor(x,y){
        this.x = x;    //this代表的是实例对象
        this.y = y;
    }
    todoSome(){  //这是个类的方法，不需要加function，有多个方法也不用逗号隔开
        alert(this.x + "的年龄是" +this.y+"岁");
    }
}
export default  Person;

静的メソッドと静的プロパティ

静的メソッドと静的プロパティは、static キーワードを使用するプロパティとメソッドです

# #静的メソッド

static classMethod(){
		console.log('123456')
	}

静的メソッドはサブクラスに継承されず、サブクラスは呼び出すことができません
• 静的メソッドのこれは、インスタンスではなくクラス クラスを指しますクラスの。したがって、
• 静的メソッドは、インスタンスではなく、クラス名を通じてのみ 呼び出すことができます。

let p = new Point();
p.classMethod();  // 报错

静的プロパティ

static prop = 1 ;  // 静态属性

静的プロパティをサブクラスに継承することはできず、サブクラスから静的プロパティを呼び出すこともできません
• 静的プロパティは、クラスのインスタンスではなく、クラス名を通じてのみ呼び出すことができます

クラスInherit extends

class は extends キーワードを使用して
• ES6 継承を継承できます。また、サブクラス コンストラクターで super() を使用する必要があります。 ES6 の継承では、最初に親クラスのインスタンス オブジェクトの属性とメソッドが this に追加され、次にサブクラスのコンストラクターを呼び出してこれを変更するためです。
• サブクラスがコンストラクター メソッドを定義していない場合、super() はデフォルト
• サブクラスを追加すると、親クラスのメソッドとプロパティが継承されますが、値関数 getter と
• を呼び出すには、サブクラスのクラス名を通じて静的メソッドとプロパティを呼び出す必要があります。

  import classtest from "./classtest";  //先引入父类
  class Man extends classtest{
      constructor(x,y){   //构造函数尽量与父类参数保持一致
          super();   //利用super()关键字，这个必须放在子类构造函数中的第一位置
          this.x = x;
          this.y = y;
      }
  }
  export default  Man;

class 値ストアド関数 setter

getter および setter は、値を読み取ってクラスの属性に転送するために使用されます。

値関数ゲッターとストレージ関数セッターは、割り当てと値の動作をカスタマイズできます。プロパティにゲッターのみがあり、セッターがない場合、プロパティは読み取り専用プロパティとなり、値を割り当てることも、値を割り当てることもできません。初めて初期化することはできますか？

変数がプライベートとして定義されている場合 (クラスの中括弧の外側で定義されている場合)、セッターなしでゲッターのみを使用できます。

let data=[1,2,3,4];  //放在类外面，属于私有变量，可以只读取
class Person{
    // 构造函数
    constructor(x,y){
        this.x = x;
        this.y = y;
    }
    get x(){
        console.log('获得name');
        return this._name;    //get读取属性
    }
    set x(x){
        console.log("设置name");  
        this._name=x;   //set给属性赋值
    }
    get data(){
        return data;   //只读属性，属性返回的值只能是私有变量
    }
    todoSome(){
        alert(this.x + "的年龄是" +this.y+"岁");
    }
    static dayin(){
        alert("dayin");
    }
}
export default  Person;

使用方法:

 var test= new this.$myutils.classtest('haha','18');
  test.x="haha3";   //改变了实例化时候的x的值
  test.todoSome();  //输出：haha3的年龄是18岁。这里就已经不是实例化时候的haha了
  console.log(test.data);   //结果：打印[1,2,3,4]

注:

1. クラス内でメソッドを定義する場合、関数キーワードをメソッドに追加することはできません。これは、JS のコンストラクターが 2 つで区切られた関数によって定義されているためです。

2. すべてのメソッドをカンマで区切らないでください。カンマで区切ると、エラーが報告されます。

【関連する推奨事項:

JavaScript ビデオ チュートリアル 、Web フロントエンド ]

以上がES6 でクラスの知識ポイントを要約して整理するの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。