Jimpop TW Code Note: [JS] PROTOTYPE筆記

Javascript 在物件導向中最簡單的方法是建立一個 function ，如下

function obj(){
    this.val='Hello';
}

並且 new 一個 obj，與設定變數 val2 為 'NICE'。
這是一個最簡單的 JS 偽class 用法....

var obj_1 = new obj();
obj_1.val2='NICE';

如果我再 new 一個，這時候在 obj_1 中的 val2 值會是未定義
(因為 obj_1 已經是個獨立空間)

var obj_2 = new obj();
obj_2.val2; \\undefinded

那 prototype 要幹嘛呢？
prototype 就是整個物件導向的最原始的模板，
於最原始的obj後面加上 prototype，就會動態的影響後面所產生出來的obj內容，
範例如下：

obj.prototype.val2 = 'MEET';
obj_2.val2; \\ MEET

明明最初的obj沒有定義val2，並且也沒在obj_2中定義 val2，
但val2 這個值就是從 obj 的原型定義來的。

如果在prototype前就已經定義的動態obj，參數會出現哪個呢？

obj_1.val2; \\ NICE

還是會以原本已經設定的值為準。

但是如果在 new 出來的obj後面加上 prototype 會發生甚麼事呢？

obj_1.prototype.val2; \\ undefinded

undefinded......

此 object 最後參數示意圖
(虛線上方是 prototype 主要要影響的區塊，但整張圖的 object 都會因原型改變跟著改變。)

小小筆記....

參考網站：

Jimpop TW Code Note