JavaScriptのprototypeをプロパティで使う上で気をつけること

そもそもPrototypeとは

JavaScript には1つだけ、継承が発生する要素があります。オブジェクトです。
どのオブジェクトもプロトタイプと呼ばれる、他のオブジェクトへの内部的な繋がりを持っています。
そのプロトタイプオブジェクトも自身のプロトタイプを持っており、
あるオブジェクトのプロトタイプが null に到達するまでそれが続きます。 null は、定義によれば、
プロトタイプを持たず、プロトタイプチェーンの最終リンクとなります。
MDN Web Docssから引用

こいつがないと継承ができない・・・
初期のjsはstaticが使えないからprototypeを使わないで複数インスタンスを作ると
使ってないメソッドとかまでメモリに在中しちゃうからメモリ圧迫しちゃう・・・
そういうときに使おうって感じで今は使ってる

メソッドや、定数以外のプロパティではPrototypeは使わない

これは配列や、オブジェクトを追加したりする時に"""やばさ"""が分かる

js

function func(){}
func.prototype.ary = new Array();
func.prototype.obj = new Object();


let f1 = new func();
let f2 = new func();

f1.obj.o1 = "o1";
f2.obj.o2 = "o2";
f1.ary.push("1");
f2.ary.push("2");

console.log(f1.obj);
console.log(f2.obj);
console.log(f1.ary);
console.log(f2.ary);

出力結果

{o1: "o1", o2: "o2"}
{o1: "o1", o2: "o2"}
(2) ["1", "2"]
(2) ["1", "2"]

これはprototypeで宣言したものはどのインスタンスからも参照できる
という仕様によって引き起こされる

こういう分かりにくいバグを起こさないためにも何も考えずにprototypeで設定するんじゃなく
下記のようにコンストラクタとしてプロパティを設定するのが良い

js

function func(){
    this.obj = new Object();
    this.ary = new Array();
}

let f1 = new func();
let f2 = new func();

f1.obj.o1 = "o1";
f2.obj.o2 = "o2";
f1.ary.push("1");
f2.ary.push("2");

console.log(f1.obj);
console.log(f2.obj);
console.log(f1.ary);
console.log(f2.ary);

出力結果

{o1: "o1"}
{o2: "o2"}
["1"]
["2"]

てかこのオブジェクト型をいじるときは気をつけよう！って前回もなんかやったな・・・

ちょっと気になってること

あるオブジェクトのプロトタイプが null に到達するまでそれが続きます。 null は、定義によれば、
プロトタイプを持たず、プロトタイプチェーンの最終リンクとなります。

この部分ってprototypeでメソッド指定した場合は、nullになるまで検索を続けるってことだから
頻繁に呼び出すメソッドだったらprototypeに書かないほうが処理が軽そうだけどあんまり気にしなくていい問題なんだろうか
調べても出てこないしあんまり気にしてる人がいなそうな感じだけど