javascript部分設計模式總結

一、實現單例模式
let 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;
}

let a = Singeton.getInstance('hello world')

2、策略模式
javascrip 函數也是對像 因此能夠用對象定義函數如
let strategies = {
"type1": (salary) => {
return salary 1
},
"type2": (salary) => {
return salary 2
},
"type3": (salary) => {
return salary * 3
}
}

let calcular = function (level, salary) {
return strategieslevel
}

三 、代理模式

就是不對原對象進行操做，引用另外的對象進行操做

let fruit = function (name) {
this.name = name;
}

fruit.prototype.getName = function () {
return this.name;
}

let 想吃蘋果人 = {
gouBuy: (name) => {
console.log('幫我買幾個蘋果' + name)
}
}

let purchasing = {
buyCosmetic: function (fruit) {
想吃蘋果人.gouBuy(fruit.getName())
}
}

purchasing.buyCosmetic(new fruit('蘋果'))

4、迭代模式
也就是經過循環匹配符合的功能需求
ar getActiveUploadObj = function () {
try {
return new ActiveXObject("TXFTNActiveX.FTNUpload"); // IE 上傳控件
} catch (e) {
return false;
}
};
var getFlashUploadObj = function () {
if (supportFlash()) { // supportFlash 函數未提供
var str = '<object type="application/x-shockwave-flash"></object>';
return $(str).appendTo($('body'));
}
return false;
};
var getFormUpladObj = function () {
var str = '<input name="file" type="file" class="ui-file"/>'; // 表單上傳
return $(str).appendTo($('body'));
};

4、發佈訂閱模式
發佈—訂閱模式又叫觀察者模式，它定義對象間的一種一對多的依賴關係，當一個對象的狀態發生改變時，全部依賴於它的對象都將獲得通知。在 JavaScript 開發中，咱們通常用事件模型來替代傳統的發佈—訂閱模式。
var event = {
clientList: [],
listen: function (key, fn) {
if (!this.clientList[key]) {
this.clientList[key] = [];
}
this.clientList[key].push(fn); // 訂閱的消息添加進緩存列表
},
trigger: function () {
var key = Array.prototype.shift.call(arguments), // (1);
fns = this.clientList[key];
if (!fns || fns.length === 0) { // 若是沒有綁定對應的消息
return false;
}
for (var i = 0, fn; fn = fns[i++];) {
fn.apply(this, arguments); // (2) // arguments 是 trigger 時帶上的參數
}
}
};
再定義一個 installEvent 函數，這個函數能夠給全部的對象都動態安裝發佈—訂閱功能：
var installEvent = function (obj) {
for (var i in event) {
obj[i] = event[i];
}
};

5、 命令模式
命令模式是最簡單和優雅的模式之一，命令模式中的命令（command）指的是一個執行某些
特定事情的指令。
命令模式最多見的應用場景是：有時候須要向某些對象發送請求，可是並不知道請求的接收
者是誰，也不知道被請求的操做是什麼。此時但願用一種鬆耦合的方式來設計程序，使得請求發
送者和請求接收者可以消除彼此之間的耦合關係。例如

var bindClick = function (button, func) {
button.onclick = func;
};
var MenuBar = {
refresh: function () {
console.log('刷新菜單界面');
}
};
var SubMenu = {
add: function () {
console.log('增長子菜單');
},
del: function () {
console.log('刪除子菜單');
}
};
bindClick(button1, MenuBar.refresh);
bindClick(button2, SubMenu.add);
bindClick(button3, SubMenu.del);
命令模式在 JavaScript 語言中是一種隱形的模式。

6、組合模式
組合模式就是用小的子對象來構建更大的對象，而這些小的子對象自己也許是由更
小的「孫對象」構成的。像樹狀結構

用途: 表示對象的部分總體層次結構。組合模式能夠方便地構造一棵樹來表示對象的部分整體結構。特別是咱們在開發期間不肯定這棵樹到底存在多少層次的時候。在樹的構造最終完成以後，只須要經過請求樹的最頂層對象，便能對整棵樹作統一的操做。在組合模式中增長和刪除樹的節點很是方便，而且符合開放封閉原則。客戶但願統一對待樹中的全部對象。組合模式使客戶能夠忽略組合對象和葉對象的區別，客戶在面對這棵樹的時候，不用關心當前正在處理的對象是組合對象仍是葉對象，也就不用寫一堆 if、else 語句來分別處理它們。組合對象和葉對象會各自作本身正確的事情，這是組合模式最重要的能力。