19/5/5 学習記録②『Javascriptその２』

Progate講座の続きから。

クラスの作成

◯Userというクラスの作成
class User {
}

インスタンスの作成
設計図(クラス)から、オブジェクトを作成する。
クラスから作成したオブジェクトのことを特別に「インスタンス」と呼ぶ。
「User」というクラスから作成した場合、「Userインスタンス」となる。

◯Userクラスにuserというオブジェクトを作成する。

class User {
}
const user = new User();

console(user);

// 出力結果
User{}

◯コンストラクタ(constructor)
インスタンスを生成するときに実行したい処理や設定を追加するための機能
インスタンスが生成された直後に実行される。
インスタンスごとに毎回実行

◯プロパティと値の追加
「this.プロパティ = 値;」

◯メソッド
インスタンスの「動作」、処理のまとまりを指す。

// クラス、インスタンス、プロパティと値、メソッドの設定
class User {
  constructor(name,age) {
    this.name = name;
    this.age  = age;
  }
  greet {
    console.log("Hello World!");
  }
}
const user = new User(yamada,30);

// 処理
console.log(`名前：${name}`);
console.log(`年齢：${age}`);
user.greet();

// 出力結果
名前：yamada
年齢：30
Hello World!

◯メソッド内でのメソッドの呼び出し
「定数.メソッド名」ではなく、「this.メソッド名」とする

// 設定
class User {
　 greet() {
    console.log("Hello World!");
  }
  info() {
  this.greet();
  }
}
const user = new User();

// 処理
user.info();

// 出力結果
Hello World!

◯クラスの「継承」
すでにあるクラスをもとに、新しいクラスを作成すること。
「extends」を使う。
クラス「A」を継承してクラス「B」を作成する場合、

class B extends A { }

となる。

◯メソッドの継承
もとのクラスで作成していたメソッドを、再度定義する必要なく使用できる。

◯メソッドの追加
継承後クラス（子クラス）にも、新たにメソッドの追加が可能。
子クラスに追加したメソッドは、継承元のクラス（親クラス）には適用されない。
親クラスで作られたものと同じ名前のメソッドを子クラスで作成した場合、子クラスのメソッドが優先される。これを「オーバーライド（Override)」と呼ぶ。

◯コンストラクタ(constructor)のオーバーライド
constructorも、メソッド同様オーバーライド可能。
子クラスのconstructorでは、1行名に必ず「super(引数)」を記述する。
super()は、親クラスのconstructor処理を実行するために必要。
その後に子クラス独自のconstructorを記述する。

class child extends parent {
  constructor(name,age,breed) {
    super(name,age);　←親クラスのconstructor実行

    this.breed = breed; ←子クラス独自の処理実行
  }
}