JavaScript 創建對象的模式

這個博客裏主要介紹一下JavaScript創建對象的一些模式。想要深入詳細瞭解還是建議大家看看書。



說起創建對象,一般來說我應該講創建女朋友的。可是想了想我就是女的,也沒什麼特殊愛好,所以我還是不創建女朋友了。行現在開始👴就是👼上帝。👴要開始造人了。
我先造一個亞當,再造一個夏娃。 打印看一下,我已經造成功了。
在這裏插入圖片描述
他倆生了孩子,叫該隱和亞伯,👴繼續造該隱和亞伯,又成功了。
但是你是不是發現問題了,這樣就出來了好多重複代碼啊。👴要是造60億人民豈不是累死。所以,我得搞得跟女媧似的,用藤蔓沾了泥土,往地上一甩,泥點點就能成人。所以我開啓工廠模式
在這裏插入圖片描述

工廠模式

工廠模式就是用函數封裝,以特定模式創建對象
👴用函數封裝了造人對象。
原來造倆人8行代碼,現在造倆人8行代碼
原來造四人16行代碼,現在造四人10行代碼。
在這裏插入圖片描述
只造人不夠啊,我還得造動物。有條🐍引誘了夏娃吃蘋果,亞伯該隱還養了🐑。我要開始造動物了。
好了現在我已經造成功了,但是問題雙來了,雖然我用了三個函數造他們,但是爲啥輸出出來都是普通object的{}形式?萬物平等?👴不同意,萬物平等我就都造人了。所以我得把他們區分開。這就用到了構造函數模式
在這裏插入圖片描述

構造函數模式

構造函數模式就是用構造函數創建特定類型的對象
構造函數形如:

//聲明
function 函數名(參數){
	函數體
}
// 使用
let 實例 = new 函數名(參數)

然後我就用構造函數的形式來創建了。發現沒,還少了聲明對象和返回值呢。
但是問題又來了。這就簡單了嗎?這不是還有大量重複代碼?this.name this.gander所有物種都這樣搞豈不是累死?那我只好繼續簡化啦。這就用到了原型模式
在這裏插入圖片描述
好了,現在讓他們叫一聲。問題又來了,如果我想讓羊也叫,蛇也叫,那豈不是又出現大量一模一樣的代碼?這個可以用原型模式解決。
在這裏插入圖片描述

原型模式

我們創建的每一個函數都會有prototype屬性,這個屬性是一個指針,指向一個對象,這個對象裏邊包含了各種“由某種特定類型的所有實例”共享的方法和屬性。

實例就是 let 實例 = new 函數名() 你聲明的這個東西就是實例。這是抽象和具體的概念。你的函數就是抽象,你的實例就是具體。

想了解原型的可以自己看這個JavaScript 詳細圖解原型
我就不詳細解析原型了,我下邊直接說方法了。
既然👴想再少寫一點代碼,那我就直接把這些相同的東西寫進原型裏。原型鏈的盡頭是Object,我就直接寫Object裏邊吧。
在這裏插入圖片描述
只要把相同的方法添加到某一個原型中,只要實例在這條原型鏈上就可以使用這個方法哦。不用每個函數都聲明瞭。
在這裏插入圖片描述
那你可能問,爲什麼你不直接把name和gander也放到原型中去。
可以是可以,但是這樣代碼量並不會減少啊。因爲你要給這些屬性賦值,你就要再把它拿出來賦值。
你看嘛。不用更改的方法寫到原型裏,那函數中就不用寫了。但是需要更改的方法,你寫道原型裏,如果你函數體中不給他賦值也沒用哦。所以我們纔要綜合使用構造函數模式和原型模式
在這裏插入圖片描述

組合使用構造函數模式和原型模式

這是創建自定義類型最常見的方式。可以將共有的方法和不需要重新賦值的屬性寫到原型中,而那些特有的屬性寫到各自的函數體中。
下圖中所有生物說的都是‘我是上帝創造的’,這是個不需要改變的屬性,因此可以把它加到原型裏。
在這裏插入圖片描述

動態原型模式

檢查某個方法是否存在,來決定是否需要初始化原型。
比如現在👴給Person這個函數的原型裏添加了speak的方法。
在這裏插入圖片描述
👴突然又不想當上帝了。讓給你吧。
可是你拿到我的代碼之後,也想讓他們說“我是XXX”,但是你不知道我裏邊寫沒寫這個方法。那怎麼辦,那就用到了動態原型模式
猜猜下邊的代碼待用之後是輸出“我是XXX”還是“哈哈哈我是XXX”?
在這裏插入圖片描述
答案是:在這裏插入圖片描述
紅框框就是動態添加原型,判斷函數原型中是否有這個方法再決定要不要添加。因爲上邊我已經寫了Person的speak方法,所以下邊判斷已經有了,就不會添加這個方法了。

寄生構造函數模式

在這裏插入圖片描述
這種對比一下工廠模式,你就會發現,其實只多了一個new

穩妥構造函數模式

穩妥構造函數模式創建對象實例方法不引用this,不使用new操作符。
在這裏插入圖片描述

穩妥對象:是指‘沒有公共屬性,方法中也不引用this’的對象
穩妥對象最適合在一些安全的環境中或者在防止數據被其他應用程序改動時使用。


今天我也精分成功了

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章