JavaScript基礎メモその4

オブジェクトと関数

オブジェクトの『値』の部分には、関数を用いることができる。

const 定数名 = {
プロパティー名: () => {
処理
}
};

// 関数の呼び出し
定数名.プロパティ名();

『定数名.プロパティ名();』で関数を呼び出す。

const user = {
name: "dai",
greet: () => {
console.log("こんにちは");
}
};
user.greet();

結果
こんにちは

#クラス
クラスはオブジェクトの設計図のようなもので、似たオブジェクト効率よく作成できる

class User {

}

クラス名は大文字から始める。
クラスは末尾に『;』は付けない

#インスタンス
インスタンスはクラスから生成されたオブジェクトのことをいう。

class Animal {
}

// const animalにAnimalインスタンスを代入
const animal = new Animal();

console.log(animal);

結果
Animal{}

#コンストラクタ
クラスにはコンストラクタと呼ばれる機能が用意されている。
コンストラクタはインスタンス生成する時に実行したい処理や設定を追加するための機能である。
クラス内に『constructor() {}』と記述する。

>```javascript
class Animal
  constructor() {
>
 }
}

class Animal {
constructor() {
console.log("こんにちは");
}
}
const animal1 = new Animal();
const animal2 = new Animal();

結果
こんにちは
こんにちは

#コンストラクタにプロパティと値を追加する
コンストラクタの中で『this.プロパティ = 値』とすることで、生成されたインスタンスにプロパティと値を追加できる。
>```javascript
class Animal {
  constructor() {
    this.name = "dai";
  }
}
const animal = new Animal();
console.log(animal.name);

結果
レオ

# コンストラクタの引数

>```javascript
class Animal {
  constructor(name, age) {
    this.name = name;
    this.age = age;
  }
}
>
const animal = new Animal("syo", 3);

メソッド

メソッドはクラスの中で定義する。『メソッド名() {}』とすることでメソッドの定義ができる。

class クラス名 {
constructor() {

}
メソッド名 () {
// 行いたい処理
}
}

>```javascript
class Animal {
  constructor(name, age) {
    this.name = name;
    this.age = age;
  }
  greet() {
    console.log("こんにちは");
  }
}
>
const animal = new Animal("syo", 3);
animal.greet();

メソッドを呼び出すには『インスタンス.メソッド名()』とする。

結果
こんにちは

#メソッド内で値を使う
メソッド内でインスタンスの値を使用するには、『this』 という特殊な値を用いて、『this.プロパティ名』 とする。

class Animal {
constructor(name, age) {
this.name = name;
this.age = age;
}
info() {
// インスタンスのnameプロパティの値になる
console.log(名前は${this.name}です);
}
}

const animal = new Animal("syo", 3);
animal.info();

結果
名前はsyoです

#メソッド内でメソッドを使う
メソッド内で 『this.メソッド名()』 とすることで、同じクラスのメソッドを使うことができる。
>```javascript
class Animal {
  greet() {
    console.log("こんにちは");
  }
  info() {
    // 同じクラスのメソッドを実行できる
    this.greet();
      //
  }
}

#継承
新しく作成するクラスが既存のクラスの一種である場合、『継承』という方法を用いることで効率よく作成できる。
『継承』とは、既にあるクラスを元に、新しくクラスを作成する方法のことである。

>```javascript
class Dod extends Animal {
}

継承を用いてクラスを作成するには『extends』を用いる。
上のコードでは、『Animalクラス』を継承して「Dogクラス』を作成している。

#継承したクラスを使う
『Dogクラス』は『Animalクラス』の全ての機能を引き継いでいる。
下のコードのように『Dogクラス』に定義されている『infoメソッド』などを使用することができる。

class Animal {
info() {
console.log(名前は${this.name}です);
console.log(${this.age}歳です);
}
}
class Dog extends Animal {
}

const dog = new Dog("ken", 4);
dog.info();
// Animalクラスに定義されているメソッドを使用できる

結果
名前はkenです
4歳です

#メソッドの戻り値
メソッドでは、関数と同じようにも踊り地を用いることができる。
>```javascript
class Dog extends Animal {
  getHumanAge() {
    return this.age *7;
    // メソッドでも戻り値は使える
  }
}
>
const dog = new Dog("gen", 4);
const humanAge = dog.getHumanAge();
console.log(humanAge);

結果
28

子クラスで定義した独自メソッドは、親クラスから呼び出すことはできない。

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

メソッドと同じように、コンストラクタもオーバーライドすることができる。
子クラスにプロパティを追加したい場合などに使用する。
コンストラクタをオーバーライドする際は1行目に『super()』と記述する必要がある。

class 子クラス extends 親クラス {
constructor() {
super();
//子クラスのコンストラクタの処理
}
}

子クラスのコンストラクタ内の『super()』では、その部分で親クラスのコンストラクタを呼び出している。
親クラスのコンストラクタが引数を受け取る場合には、『super』の後ろの丸括弧『()』に引数を渡す必要がある。