朝活のブログ

朝活のアウトプットを投稿します。

クラス【JavaScript】

f:id:morning-output:20200923083937j:plain

 クラス

クラスとは、設計図の役割をします。オブジェクトを効率良く量産するために予め設計図を用意して、それをもとにデータ生成をしていくことができます。

class User {}

クラスは「class クラス名」で用意します。クラス名は大文字から始めます。

インスタンス

class Animal {}
const animal = new Animal();

インスタンスとは、クラスから作成したオブジェクトのことです。

生成には「new class名()」と記述します。

f:id:morning-output:20200927102727p:plain

空のオブジェクトが出力されました。

コンストラク

class Animal {
 constructor() {}
}

コンストラクタとは、インスタンスを生成するときに実行したい処理や設定を追加する機能です。

class内に「constructor() {}」と記述します。

f:id:morning-output:20200927102905p:plain

コンストラクタの処理は、インスタンスが生成された直後に毎回行われます。

this

class Animal {
 constructor() {
  this.name = "ポチ";
 }
}
 

コンストラクタの中で「this.プロパティ名 = 値」とすることで、生成されたインスタンスにプロパティと値を追加できます。

f:id:morning-output:20200927103036p:plain

「console.log(animal.name)」で取り出すことができました。

引数

f:id:morning-output:20200927103245p:plain

constructor()」内に引数名を記述して、引数を受け取ることができます。

new Animal()」内に渡したい値を追加します。

メソッド

class クラス名 {
 constructor() {}
 メソッド名() {
  // 行いたい処理
 }
}

メソッドとは、関数のようなものでインスタンスの処理のまとまりを表します。

f:id:morning-output:20200927103539p:plain

this.プロパティ名」でメソッド内のインスタンスの値を使用します。

インスタンス.メソッド名()」で呼び出します。

またメソッド内でメソッドを呼び出す場合は「this.メソッド名」とします。

継承

class Dog extends Animal {}

継承とは、すでにあるクラスをもとに、新しくクラスを作成する方法です。全ての機能を引き継げます。

記述は「extends」を用いて、Animal(親クラス)からDog(子クラス)に継承します。

オーバーライド

親クラスと同じ名前のメソッドを子クラスに定義すると、子クラスのメソッドが優先して使用されます。

オーバーライドとは、子クラスのメソッドが親クラスのメソッドを上書きすることです。

メソッド同様、コンストラクタもオーバーライドさせることができます