今天,咱來聊聊JavaScript中的原型跟原型鍊
這一塊的知識,主要是設計模式方面的。
首先,我們知道JavaScript是面向對象的。既然是面向對象,那它自然也有相應的類跟對象等概念。
在JavaScript中,function這個東西還是比較特殊的,它既能用來聲明方法,還能用來聲明一個類似C#/.NET中的類,然後new一下得到一個對象。
舉例
思考:
既然person1.sayName===person2.sayName傳回false,兩個對象person1和person2各自的sayName方法雖然本身不同,實作的效果是一樣的,那可不可以讓每個對象調用的是同一個公共的方法sayName呢?答案是可以的。
這裡有個優化方案
以上的方案的确實作了想要的結果,但我們知道JavaScript是面向對象的,面向對象的三要素有個封裝。但以上的方案并沒有展現出封裝的思想。更好的方式是通過原型模式來解決。
以上便是原型模式,也并非沒有缺點,雖然不用在構造函數裡面傳遞參數來初始化,但得到的對象屬性都是一樣的。這便是最大的問題。
怎麼辦呢?
構造函數模式可以通過構造函數來傳遞參數進行初始化,原型模式可以共享某些屬性跟方法。那可不可以合二為一,将兩者結合起來,豈不更好?
二者結合,代碼如下:
以下三句話特别重要,需要深刻了解。
1、每個函數都有個prototype屬性,prototype是函數獨有的屬性。
2、每個對象都有個__proto__屬性。__proto__是對象獨有的屬性。
2、每個函數的portotype的是Object的執行個體
在JavaScript中,繼承便是通過原型鍊實作的。
既然明白以上的知識,怎麼優雅地運用到實際工作中呢?
在搞Vue項目時,我們幾乎不可避免地會通過EventBus進行元件通信。
每次都需要var bus=new Vue();
在這裡便可以通過原型模式來優化。
在其他元件,便可以直接通過this.$bus釋出訂閱事件了。