組合模式
組合模式屬于結(jié)構(gòu)型設(shè)計模式中的一種.
把一組對象組合成樹形結(jié)構(gòu),表示部分和整體的關(guān)系.調(diào)用者可以使用統(tǒng)一的方式對待組合對象和葉子對象.
組合對象和葉子對象沒有繼承關(guān)系,但是對外有一致的接口,類似于多態(tài)特性,避免使用if-else.解耦調(diào)用者和復(fù)雜元素之間的關(guān)系
比如:文件夾和文件,文件夾屬于組合對象,文件屬于葉子對象.
image.png
class Folder {
constructor(name) {
this.name = name;
this.children = [],
this.parent = null;
}
add(child) {
this.children.push(child);
child.parent = this;
}
show() {
console.log(this.name);
this.children.forEach(c => c.show()); //不必關(guān)注是Folder還是File的show
}
delete() {
// 先刪子節(jié)點,最后刪自己
this.children.forEach(c => c.delete());
console.log('刪除',this.name);
}
}
class File {
constructor(name) {
this.name = name;
this.parent = null;
}
add(child) {
child.parent = this;
}
show() {
console.log(this.name);
}
delete() {
console.log('刪除',this.name);
}
}
let root = new Folder('root');
let leve1Folder = new Folder('leve1-Folder');
let leve1File = new File('leve1-File');
let leve2Folder = new Folder('leve2-Folder');
let leve3File = new File('leve3-File');
root.add(leve1File);
root.add(leve1Folder);
leve2Folder.add(leve3File);
leve1Folder.add(leve2Folder);
root.show();
console.log('=========刪除===========');
root.delete();
打印結(jié)果
root
leve1-File
leve1-Folder
leve2-Folder
leve3-File
=========刪除===========
刪除 leve1-File
刪除 leve3-File
刪除 leve2-Folder
刪除 leve1-Folder
刪除 root
