JS设计模式

JS的设计模式

什么是设计模式

假设有一个空房间,我们要日复一日地往里 面放一些东西。最简单的办法当然是把这些东西 直接扔进去,但是时间久了,就会发现很难从这 个房子里找到自己想要的东西,要调整某几样东 西的位置也不容易。所以在房间里做一些柜子也 许是个更好的选择,虽然柜子会增加我们的成 本,但它可以在维护阶段为我们带来好处。使用 这些柜子存放东西的规则,或许就是一种模式

单例模式

确保只有一个实例,并提供全局访问,类似闭包创建后都去访问一个。

策略模式

定义一系列的算法,把它们一个个封装起来,并且使它们可以相互替换。表单验证用的多

代理模式

为一个对象提供一个代用品或占位符,以便控制对它的访问,用于对数据进行处理后返回

发布-订阅模式

也称作观察者模式(观察者模式子模式),定义了对象间的一种一对多的依赖关系,当一个对象的状态发 生改变时,所有依赖于它的对象都将得到通知 。不直接建立关系,依靠一个中间商来建立

   // 观察者
var observer = {
    // 订阅集合
    subscribes: [],

    // 订阅 存放对应key
    subscribe: function(key, fn) {
        //不存在的情况下才默认为一个空数组
        if (!this.subscribes[key]) {
            this.subscribes[key] = [];
        }
      
        
        // 订阅者的处理  是函数就推进去
        typeof fn === 'function' && this.subscribes[key].push(fn);
    },

    // 发布 
    publish: function() {
        
        var type =[].shift.call(arguments) // arguments[0]  去掉第一项 就是 key项 剩余项都是value项
        

            //调用对应key存的函数
            fns = this.subscribes[type];
           
        
        // 不存在的订阅类型,以及订阅时未传入处理回调的
        if (!fns || !fns.length) {
            return;
        }
        
        // 挨个处理调用 就是订阅同一个key很多次 然后一个个调用
        for (var i = 0; i < fns.length; ++i) {
            fns[i].apply(this, arguments);
        }
    },
     
};


//实例


observer.subscribe('examinationA', function(score) {
    console.log(score);
});

observer.subscribe('examinationA', function(score) {
    console.log(score);
});

observer.publish('examinationA', 100); // 100  100  里面两个订阅都打印了出来