這篇文章帶給大家的內容是關於js設計模式:什麼是單例模式? js單例模式的介紹,有一定的參考價值,有需要的朋友可以參考一下,希望對你有幫助。
定義:1.只有一個實例。 2.可以全域存取
主要解決:一個全域使用的類別頻繁地創建與銷毀。
js單例模式何時使用:當您想要控制實例數目,節省系統資源的時候。
如何解決:判斷系統是否已經有這個單例,如果有則返回,如果沒有則創建。
js單例模式優點: 1、記憶體裡只有一個實例,減少了記憶體的開銷,尤其是頻繁的創建和銷毀實例(例如管理首頁頁面快取)。 2、避免資源的多重佔用(例如寫文件操作)。
單例模式缺點:沒有接口,不能繼承,與單一職責原則衝突,一個類別應該只關心內部邏輯,而不關心外面怎麼樣來實例化。
js單例模式使用場景: 1.全域快取。 2.彈出視窗
const singleton = function(name) { this.name = name this.instance = null } singleton.prototype.getName = function() { console.log(this.name) } singleton.getInstance = function(name) { if (!this.instance) { // 关键语句 this.instance = new singleton(name) } return this.instance } // test const a = singleton.getInstance('a') // 通过 getInstance 来获取实例 const b = singleton.getInstance('b') console.log(a === b)
因為JavaScript 是無類別的語言,而JS 中的全域物件符合單例模式兩個條件。很多時候我們把全域物件當成單例模式來使用
var obj = {}
實現彈框的一種做法是先創建好彈框,然後使之隱藏,這樣子的話會浪費部分不必要的DOM 開銷,我們可以在需要彈框的時候再進行創建,同時結合單例模式實現只有一個實例,從而節省部分DOM 開銷。下列為登錄框部分程式碼:
//弹框层的实践 const createLoginLayer = function() { const myDiv = document.createElement('div') myDiv.innerHTML = '登入浮框' // myDiv.style.display = 'none' document.body.appendChild(myDiv); return myDiv } //使单例模式和创建弹框代码解耦 const getSingle = function(fn) { let result = null; return function() { if(!result){ result = fn.apply(this, arguments); } return result; } } const createSingleLoginLayer = getSingle(createLoginLayer) document.getElementById('loginBtn').onclick = function() { createSingleLoginLayer() }
相關建議:
以上是js設計模式:什麼是單例模式? js單例模式的介紹的詳細內容。更多資訊請關注PHP中文網其他相關文章!