JS設計模式 單列模式

2022-04-03 12:10:39 字數 1716 閱讀 7034

核心:保證乙個類僅有乙個例項,並提供乙個訪問它的全域性訪問點

js中的單列模式關鍵字:建立唯一的物件

(一)基本實現:判斷是否已有例項,有則直接返回,否則生成例項

var single = (function()

})()

var a = new single()

var b = new single()

console.log(a === b)

這裡通過閉包,將單列物件儲存在變數instance中

(二)場景:實現乙個提示文字的彈出,2秒自動消失,期間再次呼叫錯誤提示時不能重複彈出 

//實現提示文字

function tip(msg),2000)

return instance

}

目前這種實現是有問題的,多次呼叫時候會有重複div生成,我們可以根據單例模式的基本實現處理下:

//實現單例

var tip_1 = (function(),2000)

}})()

(三)通用的單例

--------通用的單例實現**-----------

function getsingle(fn)

}

具體應用一:

function createloginlayer()

var singlecreateloginlayer = getsingle(createloginlayer)

window.onclick = function()

通過通用的單例,我們可以將單例的實現和具體業務分離開來,注意:在業務函式中一定要return返回乙個具體例項,否則getsingle無效

(四)單例的擴充套件

有些特殊的場景,我們需要對通用的單例模式進行擴充套件:

擴充套件場景一:  

//按鈕重複提交問題:

$(document).on('click',function()

})})

//優化

var goajax = function(),

error:function(),

})}$(document).on('click',getsingle(goajax))

這個優化目前存著問題,click事件只能執行一次ajax,因為第一次ajax的例項存在了就不會再去執行,所以我們這裡需要能夠控制到例項

function single()

single.prototype.getinstance = function(fn)

}var goajaxsingle = new single()

var goajax = function()

})}$(document).on('click',goajaxsingle.getinstance(goajax))

這樣,在success之前,因為例項存在,所以不能被執行多次ajax

擴充套件場景二:

//快取**場景

function add(num1,num2)

var proxyfun = function(fn)

return function() }}

var proxyadd = proxyfun(add)

proxyadd(1,1)

這裡可以看作**模式,也可以看作單例模式的擴充套件

JS單列設計模式

利用閉包的兩個機制 保護和儲存 實現模組化管理。單列設計模式 最早的模組化實現方式,是利用閉包的機制,對功能相近的 實現模組化管理。還可以解決多人開發時命名衝突的問題。栗子 有兩個不同的模組,但是這兩個模組中又有某個功能是相同的,如何實現只寫一次,就能讓兩個模組都能實現 呼叫 該功能 方法 呢?單列...

設計模式 單列模式

何為設計模式呢?簡單的說就是能重複利用的解決方案,當碰到a專案也出現這種情況,b專案也出現這種情況 那麼是否能把這懂實現功能抽象出來,形成一種解決方案.單列模式 顧名思義就是乙個例項 即乙個物件只能初始化一次 作用 減少開闢記憶體空間,節約記憶體開銷 class program 因為a物件在記憶體堆...

設計模式 單列模式

原文 單例模式是最常用到的設計模式之一,熟悉設計模式的朋友對單例模式都不會陌生。一般介紹單例模式的書籍都會提到餓漢式和懶漢式這兩種實現方式。但是除了這兩種方式,本文還會介紹其他幾種實現單例的方式,讓我們來一起看看吧。單例模式是一種常用的軟體設計模式,其定義是單例物件的類只能允許乙個例項存在。許多時候...