命令模式是JavaScript設(shè)計(jì)模式中行為型的一種設(shè)計(jì)模式;
定義:
向某些對象發(fā)送請求,但是并不知道被請求的操作具體是什么咆爽,所以我們希望以一種松耦合的方式來設(shè)計(jì)程序,使得請求發(fā)送者和接收者之間能夠消除彼此之間的耦合關(guān)系置森;而我們的這種松耦合的方式就是命令模式斗埂;
白話解釋:
假如你是你們公司研發(fā)部門團(tuán)隊(duì)leader,這時(shí)你們領(lǐng)導(dǎo)分布給你一個(gè)任務(wù)凫海,你粗略的看了一下呛凶,很簡單的需求比較容易實(shí)現(xiàn);而你作為團(tuán)隊(duì)leader行贪,每天肯定會(huì)有很多事情漾稀,所以你準(zhǔn)備把需求直接丟給組員去開發(fā)和實(shí)現(xiàn)模闲;領(lǐng)導(dǎo)根本不在意是你做的還是你讓誰做的,領(lǐng)導(dǎo)要的只是最終成果县好!這里領(lǐng)導(dǎo)就是命令的發(fā)布者围橡,而你就是命令的接收者;
代碼實(shí)現(xiàn):
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
<button id="button1">發(fā)布命令給前端</button>
<button id="button2">發(fā)布命令給后臺(tái)</button>
</body>
<script>
var button1 = document.getElementById("button1");
var button2 = document.getElementById("button2");
// 定義命令
var command = function(Executor,func){
Executor.onclick = func;
}
// 定義領(lǐng)導(dǎo)
var Leader = {};
Leader.teamleader = {
web:function(){
console.log("前端馬上完成");
},
java:function(){
console.log("后臺(tái)馬上完成")
}
}
command(button1,Leader.teamleader.web);
command(button2,Leader.teamleader.java);
</script>
</html>
運(yùn)行結(jié)果:
這里的將命令對象單獨(dú)的定義為一個(gè)方法缕贡,根據(jù)參數(shù)執(zhí)行不同的任務(wù)翁授。點(diǎn)擊不同按鈕的時(shí)候,執(zhí)行不同的命令晾咪;
宏命令:
宏命令是一組命令的集合收擦,通過執(zhí)行宏命令的方式可以一次性執(zhí)行一批命令;
電腦開機(jī)自啟動(dòng)項(xiàng):現(xiàn)在很多軟件都默認(rèn)添加了電腦開機(jī)自啟動(dòng)谍倦,就是我們電腦開機(jī)之后默認(rèn)啟動(dòng)某些特定的軟件塞赂;這就是一種宏命令的場景;
var QQCommand = {
excute:function(){
console.log("自啟動(dòng)QQ成功");
}
}
var weChatCommand = {
excute:function(){
console.log("自啟動(dòng)微信成功");
}
}
var MacroCommand = function(){
return {
list:[],
add:function(command){
this.list.push(command);
},
excute:function(){
for(var i = 0,command;command = this.list[i++];){
command.excute();
}
}
}
}
var macroCommand = MacroCommand();
macroCommand.add(QQCommand);
macroCommand.add(weChatCommand);
macroCommand.excute();
上面的代碼中昼蛀,我們在宏命令對象中定義了一個(gè)list數(shù)組宴猾,然后通過add方法進(jìn)行添加到執(zhí)行隊(duì)列中,所謂的執(zhí)行隊(duì)列就是list這個(gè)數(shù)組叼旋,然后我們通過循環(huán)來依次執(zhí)行命令仇哆,這就產(chǎn)生了我們的宏命令,通過一個(gè)命令一鍵啟動(dòng)多個(gè)任務(wù)夫植;
命令模式其實(shí)就是定義一個(gè)命令對象讹剔,請求發(fā)布者通過參數(shù)化的形式傳入?yún)?shù)來進(jìn)行執(zhí)行具體不同的操作,來達(dá)到請求發(fā)布者與接收者的解耦详民;
最后的話:
本系列一共寫了十篇常用的JavaScript設(shè)計(jì)模式的文章延欠,參考了大量的資料加上自己的理解希望以最通俗易懂的方式來講給大家聽,由于本人水平和精力有限沈跨,理解有誤的地方請及時(shí)指出由捎,設(shè)計(jì)模式系列文章暫時(shí)先擱置,后續(xù)再補(bǔ)充饿凛;下個(gè)月開始準(zhǔn)備系統(tǒng)學(xué)習(xí)ES6隅俘,完成ES6系列文章;