js 設計模式——單例模式
阿新 • • 發佈:2021-06-21
定義
單例就是保證一個類只有一個例項。
實現方法是,先判斷例項是否存在,如果存在則直接返回,如果不存在,則建立例項物件,並將例項物件儲存在靜態變數中,當下次請求時,則可以直接返回這個例項物件,確保了一個類只有一個例項物件。
應用:彈窗,登入,node模組,webpack模組等。
模板
class Analyzer{ private static instance: Analyzer static getInstance(){ if(!Analyzer.instance){ // 如果Analyzer沒有instance Analyzer.instance = newAnalyzer() } return Analyzer.instance } } // 使用 const analyzer = Analyzer.instance()
彈窗
// 優化:單一職責,所有函式,它的職責只有一個 function creatDom() { let dom = document.createElement('div') dom.style.display='none' document.body.append(dom) return dom } let Single =(function() { let instancereturn function(fn) { return instance || (instance = fn.apply(this, arguments)) } })() let Alert = (function(){ let instance let dom /* 違背單一職責 function creatDom() { if(!dom){ dom = document.createElement('div') dom.style.display='none' document.body.append(dom) } }*/ function Alert(content) { instance = instance || (this instanceof Alert? this : new Alert(content)) instance.init(content) return instance } Alert.prototype.init=function(content){ // creatDom() dom = Single(creatDom) // 建立一個新的單體 dom.innerHTML = content dom.style.display = 'block' } Alert.prototype.hide = function(){ dom.style.display = 'none' } return Alert })() let a=Alert('aaaaa') let b=new Alert('bbbbb') console.log(a.content) console.log(b.content) console.log(a === b)