JavaScriptの勉強 オブジェクト class 継承

Programming



似たようなオブジェクトをたくさん作って管理したいとき
簡潔に構文を書くために class を使う
例えば複数のメンバーを管理したいとき

まず class を作り
各オブジェクトを作る
classから作られる各オブジェクトの事をインスタンスと言う

例えば複数のメンバーを管理したいとき

‘use strict’;
{
//class
  class player {
    constructor(name,score) { //メソッド
      this.name = name;
      this.score = score;
    }
}
const toshilog = new player(‘toshilog’,70);
const toratora = new player(‘toratora’,85);
console.log(toshilog.name);
}
実行結果

タイトルなし

次は別のメソッド showInfo と言う関数を使ったメソッド

‘use strict’;
{
//class
  class player {
    constructor(name,score) { //メソッド
      this.name = name;
      this.score = score;
    }
    showInfo() {
      console.log(`name: ${this.name} score: ${this.score}`);//間違いやすい
    }
}
const toshilog = new player(‘toshilog’,70);
const toratora = new player(‘toratora’,85);
// console.log(toshilog.name);
toshilog.showInfo();
toratora.showInfo();
}
実行結果
タイトルなし

static キーワードをつけるとインスタンスることなく呼び出す事が出来る
このクラスには関係ある機能をつけるときに便利なもの

‘use strict’;
{
//class
  class player {
    constructor(name,score) { //メソッド
      this.name = name;
      this.score = score;
    }
    showInfo() {
      console.log(`name: ${this.name} score: ${this.score}`);
    }
    static showVersion(){
      console.log(‘player class ver. 3.0’);
    }
}
const toshilog = new player(‘toshilog’,70);
const toratora = new player(‘toratora’,85);
// console.log(toshilog.name);
// toshilog.showInfo();
// toratora.showInfo();
player.showVersion();
}
実行結果
タイトルなし

classの継承
例)野球ゲーム

‘use strict’;
{
//class
  class player {//親クラス
    constructor(name,score) {
      this.name = name;
      this.score = score;
    }
    showInfo() {
      console.log(`name: ${this.name} score: ${this.score}`);
    }
  }
    class baseballplayer extends player {//子クラス
      constructor(name,score,number){
        super(name,score);
        this.number = number;
       }
       batting(){
         console.log(‘Homerun!’);
       }
    }
    const toshilog = new baseballplayer(‘toshilog’,10,100);
    toshilog.batting();
    console.log(toshilog.number);
    toshilog.showInfo();
}

 上記の構文でextends playerを使ってあげると親クラスのプロパティとメソッドを継承できる。
実行結果
タイトルなし


今日はこれぐらいにしておきます。ちょっとしかできませんでした。毎日コツコツ一歩前進。

コメント

Translate »