JavaScript prototypeでメソッドを追加してプロトタイプを使用するサンプル

2022年11月15日

環境
Windows 10 Home 64bit
Google Chrome 107.0.5304.107

構文
1.無名関数を宣言します

関数A = function(変数名){
　　　処理コード
};

2.メソッドの処理コードを追加します

関数A.prototype.メソッド名 = function(){
　　メソッドの処理
}

4.追加メソッドを使用
変数名 = new 関数A();
関数A.追加したメソッド

使用例

//プロトタイプを使用する場合
const City = function(cr){
      this.name = cr;
};

City.prototype.getName=function(){
      return this.name;
}

console.log("インスタンスを生成する結果");
//プロトタイプのgetNameを参照する
const resA = new City("東京");
const resB = new City("大阪");
const resC = new City("福岡");

console.log("getNameメソッドを参照し値を返す結果");
console.log(resA.getName()); 
console.log(resB.getName());
console.log(resC.getName());

実行結果

> "インスタンスを生成する結果"
> "getNameメソッドを参照し値を返す結果"
> "東京"
> "大阪"
> "福岡"