[JavaScript]-クラスの基本構文

JavaScript言語では、インスタンスオブジェクトを生成する従来の方法はコンストラクターを使用します。es6クラスの出現により、基本的にes5コンストラクターとプロトタイプが置き換えられ、コード構造がより簡潔になります。
1.コンストラクターの記述方法は、従来のオブジェクト指向言語（C ++やJavaなど）とは大きく異なります。これは、jsを初めて使用するプログラマーを簡単に混乱させる可能性があります。
2. ES6は、従来の言語に近い書き方を提供し、オブジェクトのテンプレートとしてクラス（クラス）の概念を導入します。classキーワードを使用すると、クラスを定義できます。
3.新しいクラス書き込みメソッドは、オブジェクトプロトタイプの書き込みメソッドをより明確にし、オブジェクト指向プログラミングの構文に似たものにします。

ES5オブジェクトの作成

function Person(name, age) {
  this.name = name;
  this.age = age;
}

Person.prototype.sayHi = function () {
  console.log("hello, 我是" + this.name);
};

var p = new Person("lw", 36);
p.sayHi();

ES6オブジェクトの作成

class Person {
  constructor(name, age) {
    this.name = name;		// 属性
  	this.age = age;
  }

  sayHi() {		// 方法
 	console.log("hello, 我是" + this.name);	// sayHi是原型对象的属性
  };
}

var p = new Person("lw", 36);
p.sayHi();

constructor方法 

constructor()このメソッドは、クラスのデフォルトのメソッドでありnew、コマンドによってオブジェクトインスタンスが生成されるときに自動的に呼び出されます。クラスにはconstructor()メソッドが必要です。明示的に定義されていない場合、デフォルトで空のconstructor()メソッドが追加されます。 （クラスはコンストラクターです）

class Point {
}
​
// 等同于
class Point {
  constructor() {}
}

上記のコードでは、空のクラスPointが定義されており、JavaScriptエンジンはそれに空のconstructor（）メソッドを自動的に追加します。コンストラクター（）メソッドはデフォルトでインスタンスオブジェクト（つまり、これ）を返し、別のオブジェクトを返すように指定できます。

class Foo {
  constructor() {
    return Object.create(null);
  }
}
​
new Foo() instanceof Foo
// false

上記のコードでは、constructor()関数は新しいオブジェクトを返し、その結果、インスタンスオブジェクトFooはクラスのインスタンスではなくなります。

クラスはnew呼び出しを使用する必要があります。使用しない場合、エラーが報告されます。これは、通常のコンストラクターとの大きな違いであり、コンストラクターnewがなくても実行できます。

class Foo {
  constructor() {
    return Object.create(null);
  }
}
​
Foo()
// TypeError: Class constructor Foo cannot be invoked without 'new'

 class Person {
      constructor(name, age, gender) {
        this.name = name
        this.age = age
        this.gender = gender
      }
      say() {
        console.log(this.name);
      }
    }

    class Student extends Person {
      constructor(name, age, gender, ss) {
        // super 一定要写在构造函数constructor里面，否则会语法错误
        super(name, age, gender)        // 就如Person.call(this,name,age,gender)
      }
      get m() {            // get是取值函数
        super.say()
      }
    }
    let per = new Person('rose')
    let stu = new Student('jack', 20, '男')
    console.log(stu);    // Student {name: 'jack', age: 20, gender: '男'}

    per.say()    // rose
    stu.m        // jack