组合模式

组合模式：将多个类启动起来 - 批量启动

class Tab{
    init(){
        console.log("tab切换启动了");
    }
}

class Carousel{
    init(){
        console.log("轮播图启动了");
    }
}

class Enlarge{
    init(){
        console.log("放大镜启动了");
    }
}

// 做一个启动器，将三个效果同时启动起来
class Starter{
    constructor(){
        // 定义一个属性存储多个对象
        this.container = [];
    }
    add(obj){ // 将所有需要启动的对象存储起来
        this.container.push(obj)
    }
    init(){
        // 启动所有效果
        // 对象.init()
        // 遍历数组得到多个对象，每个对象都调用init就ok
        for(var i=0;i<this.container.length;i++){
            this.container[i].init()
        }
    }
}

var s = new Starter()
s.add(new Tab)
s.add(new Carousel)
s.add(new Enlarge)
console.log(s);
s.init()

 组合模式的变形1

class Tab{
    init(){
        console.log("tab切换启动了");
    }
}

class Carousel{
    init(){
        console.log("轮播图启动了");
    }
}

class Enlarge{
    init(){
        console.log("放大镜启动了");
    }
}

class Starter{
    constructor(){
        // 定义一个属性存储多个对象
        this.container = [];
    }
    add(...arr){
        this.container = this.container.concat(arr) // 将arr合并到container中
    }
    init(){
        for(var i=0;i<this.container.length;i++){
            this.container[i].init()
        }
    }
}

var s = new Starter()
// 不要多次调用add，希望一次调用解决问题
s.add(new Tab,new Carousel,new Enlarge)
s.init()

组合模式的变形2

class Tab{
    init(){
        console.log("tab切换启动了");
    }
}

class Carousel{
    start(){
        console.log("轮播图启动了");
    }
}

class Enlarge{
    kaiqi(){
        console.log("放大镜启动了");
    }
}

class Starter{
    constructor(){
        // 定义一个属性存储多个对象
        this.container = []; // {}
        /*
        {
            init:new Tab,
            start:new Carousel,
            kaiqi:new Enlarge
        }

        [
            ['init',new Tab],
            ['start',new Carousel],
            ['kaiqi',new Enlarge]
        ]
        */
    }
    add(...arr){
        this.container = this.container.concat(arr) // 将arr合并到container中
    }
    init(){
        for(var i=0;i<this.container.length;i++){
            // console.log(this.container[i]);
            for(var attr in this.container[i]){
                // console.log(attr); // 方法名
                // console.log(this.container[i][attr]) // 需要开启的对象
                this.container[i][attr][attr]()
            }
        }
    }
}

var s = new Starter()
// 不要多次调用add，希望一次调用解决问题
s.add({'init':new Tab},{'start':new Carousel},{'kaiqi':new Enlarge})
s.init()