js的常用設計模式

2021-10-03 09:26:12 字數 3210 閱讀 1651

單例模式主要是為了解決乙個痛點,就是如何同乙個建構函式,生成同乙個例項化物件,防止重複例項化。

原理:判斷這個建構函式是否,使用用過

如果使用過,返回之前的物件

如果沒有使用過,就執行建構函式,生成例項化物件

解決,重複建立物件的問題

**如下:

// 1 , 建立乙個建構函式 , 空的建構函式

function creatobj(){};

// 2 , 建立乙個變數,原始數值

let res = null;

// 3 , 建立單例模式的函式

function singleton()

return res;

}const obj1 = singleton();

const obj2 = singleton();

console.log(obj1 === obj2);//結果為true實現單例

#

// 通過乙個'遙控器',控制所有入口函式的執行

class a

// 入口函式

init()

// 建構函式方法

a1(){}

a2(){}

a3(){}

a4(){}

}// 建構函式b

// 通過入口函式可以控制建構函式中所有方法的執行

class b

// 入口函式

init()

// 建構函式方法

b1(){}

b2(){}

}// 建構函式c

// 通過入口函式可以控制建構函式中所有方法的執行

class c

// 入口函式

init()

// 建構函式方法

c1(){}

c2(){}

c3(){}

}// 有三個建構函式,建構函式中,有對應的入口函式函式

// 普通方法

const a = new a();

const b = new b();

const c = new c();

// 呼叫例項化物件中的入口函式

a.init();

b.init();

c.init();

// 所謂的組合模式

// 通過乙個'遙控器' , 同時控制 a.init();b.init();c.init();

// 乃至所有的 init() 入口函式

// 要實現觀察者模式 , 需要5個部分的操作

// 1,有乙個主體物件

// 2,有乙個屬性(訊息盒子),是儲存事件

// 3,有乙個方法(on方法),向屬性中寫入事件

// 4,有乙個方法(emit方法),執行屬性中寫入的事件

// 5,有乙個方法(off方法),刪除屬性中寫入事件

// 基本**

class observer ;

}// 事件1:on()方法,向訊息盒子中,新增事件

// on()方法的引數

// 引數1 : 需要執行的事件的型別

// 引數2 : 需要執行的事件的內容

on(type, fun) 中 執行的內容,交換乙個位置

if (this.message[type]) else

}// 事件2:emit()方法,執行訊息盒子中儲存的事件

emit() {}

// 事件3:off()方法,刪除訊息盒子中儲存的事件

// 刪除訊息盒子中,這個型別下的,符合的所有執行內容

// 1,先判斷是否有這個型別

// 如果沒有這個型別,執行return終止之後函式的執行

// 2,有這個這個型別,刪除這個型別中,所有的這個內容

// 兩個引數

// 引數1: 需要執行刪除事件,所在的型別

// 引數2: 需要執行刪除的事件

off(type, fun)

// 2如果有這個型別,刪除型別中,對應的內容

// 型別中, 以 陣列的形式 儲存資料

// 迴圈遍歷陣列,如果陣列中的資料,與,需要刪除的內容,相同,就刪除這個單元

// 注意要防止陣列坍塌 ,要新增i--

// 從索引0開始 迴圈到最後乙個單元 this.message中型別儲存的陣列的最後乙個單元

for (let i = 0; i <= this.message[type].length - 1; i++) }}

}// 通過 建構函式 生成例項化物件

const obj = new observer();

// 向訊息盒子中寫入需要執行的操作,也就是函式

// 函式,一定不能有(),否則就是執行函式,不是寫入函式引數

// 新增call型別的操作內容

obj.on('call', baba);

obj.on('call', mama);

obj.on('call', yeye);

obj.on('call', baba);

obj.on('call', baba);

obj.on('call', baba);

// 新增檢查型別的操作內容

obj.on('xiejiancha', jiancha1);

obj.on('xiejiancha', jiancha2);

obj.on('xiejiancha', jiancha3);

console.log(obj.message);

// 執行刪除操作

// 刪除的型別和刪除的內容

// 先判斷是否有這個型別

// 沒有執行執行return

// 有這個型別

// 迴圈遍歷這個型別儲存的陣列

// 如果有相同的內容,就刪除這個內容

// 並且為了防止陣列坍塌,新增 i--

obj.off('call', baba);

// 需要執行的操作,是函式

// 打**型別中,執行的內容

function baba()

function mama()

function yeye()

// 寫檢查型別中,執行的內容

function jiancha1()

function jiancha2()

function jiancha3()

console.log(obj);

JS常用設計模式

在執行當前 single 只獲得唯一乙個物件 單例模式,是一種常用的軟體設計模式。在它的核心結構中只包含乙個被稱為單例的特殊類。通過單例模式可以保證系統中,應用該模式的乙個類只有乙個例項。即乙個類只有乙個物件例項。var single function return return instance ...

js的設計模式

單例模式 應用 function msg msg.prototype.init function str var singlecase function instance.init text return instance var m1 singlecase hello var m2 singlec...

JS設計模式

什麼是模式?什麼是設計模式?設計模式是解決軟體設計常見問題的可復用方案 什麼是反模式?反模式是一種針對某個特定問題的不良解決方案,該方案會導致槽糕的情況發生 單例模式?皇帝單例模式 var kingsingleton function return 皇帝存在返回皇帝 return instance ...