JavaScript組合模式學(xué)習(xí)要點(diǎn)

更新時間：2016年08月26日 14:17:41 投稿：mrr

組合模式大概是設(shè)計(jì)模式里面使用最為廣泛的模式之一了，模式本身理解起來也比較簡單，以至于可以毫不費(fèi)力的寫出一個能用的組合模式偽代碼

組合模式：將一組對象組合成樹形結(jié)構(gòu)，并統(tǒng)一對待組合對象和葉對象，忽略它們之間的不同（因?yàn)槿~對象也可以也可以包含葉對象而成為組合對象），組合模式中的對象只能是一對多的關(guān)系，不能出現(xiàn)多對一。

基本單元：一個組合對象包含多個葉對象。每個基本單元又可以是別的組合對象的葉對象類似文件夾與它里面的內(nèi)容的關(guān)系網(wǎng)，一個文件夾或文件又可以是其它文件夾的內(nèi)容，但一個文件夾或文件不能同時屬于多個上級文件夾。

在JavaScript中實(shí)現(xiàn)組合模式時，要保證組合對象和葉對象擁有相同的接口方法，對同一組葉對象的操作必須具有一致性。

例子：

//定義組合對象
var Folder = function (name) {
this.name = name;
this.parent = null;
this.files = [];
};
Folder.prototype.add = function (file) {
file.parent = this;
if(this.files.indexOf(file) === -1){
this.files.push(file);
}else{
console.log('\''+file.name+'\'已存在,添加失敗');
}
};
Folder.prototype.scan = function () {
if(this.parent){
console.log('開始掃描\''+this.parent.name+'\': '+this.name);
}else{
console.log('開始掃描根目錄: '+this.name);
}
//關(guān)鍵在這里，調(diào)用所有它的葉對象的接口方法scan()
for(var i = 0, file; file = this.files[i++];){
file.scan();
}
};
Folder.prototype.remove = function (file) {
var n = this.files.indexOf(file);
if(n === -1){console.log('無法刪除: \''+file.name+'\'不存在:');}
if(n >= 0){
this.files.splice(n,1);
console.log('成功刪除:'+file.name);
}
};
//定義葉對象
var File = function (name) {
this.name = name;
this.parent = null;
};
File.prototype.add = function () {
console.log('不能添加在文件下面');
};
File.prototype.scan = function () {
console.log(this.parent.name+': '+this.name);
};
File.prototype.remove = function (file) {
console.log('無法刪除: \''+file.name+'\'不存在:');
};
//測試
var folder = new Folder('目錄');
var folder1 = new Folder('學(xué)習(xí)質(zhì)料');
var folder2 = new Folder('javascript');
var file1 = new File('Node.js');
var file2 = new File('qq.jpg');
folder.add(folder1);
folder.add(folder1);
folder.add(folder2);
folder1.add(file1);
folder2.add(file2);
//'學(xué)習(xí)質(zhì)料'添加成功
//'學(xué)習(xí)質(zhì)料'已存在,添加失敗
//'javascript'添加成功
//'Node.js'添加成功
//'qq.jpg'添加成功
folder.remove(folder1);
folder.remove(folder1);
file1.remove(file1);
//成功刪除:學(xué)習(xí)質(zhì)料
//無法刪除: '學(xué)習(xí)質(zhì)料'不存在:
//無法刪除: 'Node.js'不存在:
folder.scan(); //這里相當(dāng)于執(zhí)行了一個宏命令
//開始掃描根目錄: 目錄
//開始掃描'目錄': javascript
//javascript: qq.jpg

以上所述是小編給大家介紹的JavaScript組合模式，希望對大家有所幫助，如果大家有任何疑問請給我留言，小編會及時回復(fù)大家的。在此也非常感謝大家對腳本之家網(wǎng)站的支持！

您可能感興趣的文章: