常见的6种JavaScript设计模式

工厂模式：

function Animal(opts){ var obj = new Object();
           obj.name = opts.name;
          obj.color = opts.color;
         obj.getInfo = function(){
              return '名称：'+obj.name +'，颜色：'+ obj.color;
           }
        return obj;
 }
var cat = Animal({name: '波斯猫', color: '白色'}); 
cat.getInfo();

构造函数模式：

function Animal(name, color){ 
    this.name = name; this.color = color;
    this.getName = function(){ return this.name; } 
  } 
  // 实例对象 
 var cat = new Animal('猫', '白色');
 console.log( cat.getName() );

混合模式：

function Animal(name, color){
      this.name = name;
      this.color = color;
      console.log( this.name + this.color)
    }
 Animal.prototype.getInfo = function() {
      console.log('名称：'+ this.name)；
      }
  function largeCat(name, color){
       Animal.call(null, name, color); 
       this.color = color; 
     }
    largeCat.prototype = create(Animal.prototype);
function create (parentObj){
     function F(){}; 
     F.prototype = parentObj;
return newF(); };
largeCat.prototype.getColor = function(){ return this.color; }
var cat = new largeCat("Persian", "白色");
console.log( cat )

模块模式：

封装大部分代码，只暴露必需接口

var Car = (function(){ 
    var name = '法拉利';
     function sayName(){ 
          console.log( name ); 
     } 
     function getColor(name){
          console.log( name );
     }
return { name: sayName, color: getColor } })();
Car.name(); 
Car.color('红色');

单例模式：

单例模式是JavaScript中最常见的一种模式，通过这种模式可以为我们提供一个命名空间，例如jQuery库的命名空间为jQuery或$。命名空间的使用是为了让代码更加整洁，在多人协作开发的情况下，不同的人定义的变量很有可能重复，此时就需要使用命名空间来约束每个人定义的变量，使相同名称的变量放在不同的命名空间中，避免相互干扰。

var Single = (function(){ 
     var instance; function init() {
    //define private methods and properties
    //do something
     return { //define public methods and properties };
     }
return { // 获取实例
    getInstance:function(){
          if(!instance){ instance = init(); }
          return instance;
      }
   }
 })();
var obj1 = Single.getInstance();
var obj2 = Single.getInstance();
console.log(obj1 === obj2); //true

发布订阅模式：

发布—订阅模式又叫观察者模式，它定义了对象间一对多的关系，让多个观察者对象同时监听某一个主题对象，当一个对象发生改变时，所有依赖于它的对象都将得到通知。 定义一个事件对象，它有以下功能：
监听事件（订阅公众号）；
触发事件（公众号发布）；
移除事件（取订公众号）

var Event = (function(){
         var list = {}, listen, trigger, remove;
         listen = function(key,fn){ //监听事件函数
             if(!list[key]){ list[key] = []; //如果事件列表中还没有key值命名空间，创建 }                                    
         list[key].push(fn); //将回调函数推入对象的“键”对应的“值”回调数组
       };
     trigger = function(){ //触发事件函数
         var key = Array.prototype.shift.call(arguments); //第一个参数指定“键”
         msg = list[key];
         if(!msg || msg.length === 0){
                return false; //如果回调数组不存在或为空则返回false
          }
    for(var i = 0; i < msg.length; i++){
         msg[i].apply(this, arguments); //循环回调数组执行回调函数
        } 
  };
    remove = function(key, fn){ //移除事件函数
    var msg = list[key];
    if(!msg){ return false; //事件不存在直接返回false }
    if(!fn){ delete list[key]; //若没有后续参数，删除整个回调数组
    }else{ for(var i = 0; i < msg.length; i++){
           if(fn === msg[i]){
               msg.splice(i, 1); //删 除特定回调数组中的回调函数
                }
             }
        } 
  };
return { listen: listen, trigger: trigger, remove: remove } })();
var fn = function(data){ console.log(data + '的推送消息：xxxxxx......'); //2016.11.26的推送消息 }
Event.listen('某公众号', fn);
Event.trigger('某公众号', '2016.11.26');
Event.remove('某公众号', fn);