//单例模式
场景:一个单一对象,比如:弹窗,点击多少次只创建一次
class CreateUser {
    constructor(name) {
        this.name = name;
        this.getName();
    }
    getName() {
        return this.name;
    }
}
//代理实现单例
var ProxyMode = (function(){
    var instance = null;
    return function(name) {
        if(!instance) {
            instance = new CreateUser(name);
        }
        return instance
    }
})() //由于闭包,导致变量instance始终存在于内存之中
var a = new ProxyMode('aaa');
var b = new ProxyMode('bbb');
console.log(a === b);

//策略模式
//我认为比较简单的,策略类:可变,环境类:调用策略类的方法
var levelObj = {
    'a': function(b){
        return b * 1
    },
    'b': function(b){
        return b * 2
    },
    'c': function(b){
        return b * 3
    }
}
var calculateBouns = function(level, b){
    return levelObj[level](b);
}
console.log(calculateBouns('a',1)) //1

//代理模式
//适用场景:图片懒加载的方式,先通过loading图占位,然后异步加载图片至img标签
var imgFunc = (function() {
    var imgNode = document.createElement('img');
    document.body.appendChild(imgNode);
    return {
        setSrc: function(src) {
            imgNode.src = src;
        }
    }
})();
var proxyImage = (function() {
    var img = new Image();
    img.onload = function() {
        imgFunc.setSrc(this.src);
    }
    return {
        setSrc: function(src) {
            imgFunc.setSrc('./loading,gif');
            img.src = src;
        }
    }
})();
proxyImage.setSrc('./pic.png');


//中介者模式
//中介者模式适用的场景:例如购物车需求,存在商品选择表单、颜色选择表单、购买数量表单等等,都会触发change事件,那么可以通过中介者来转发处理这些事件,实现各个事件间的解耦,仅仅维护中介者对象即可。
var goods = {   //手机库存
    'red|32G': 3,
    'red|64G': 1,
    'blue|32G': 7,
    'blue|32G': 6,
};
//中介者
var mediator = (function() {
    var colorSelect = document.getElementById('colorSelect');
    var memorySelect = document.getElementById('memorySelect');
    var numSelect = document.getElementById('numSelect');
    return {
        changed: function(obj) {
            switch(obj){
                case colorSelect:
                    //TODO
                    break;
                case memorySelect:
                    //TODO
                    break;
                case numSelect:
                    //TODO
                    break;
            }
        }
    }
})();
colorSelect.onchange = function() {
    mediator.changed(this);
};
memorySelect.onchange = function() {
    mediator.changed(this);
};
numSelect.onchange = function() {
    mediator.changed(this);
};


//装饰者模式
//在不改变对象自身基础之上,在程序运行期间给对象动态地添加方法
Function.prototype.before = function(beforefn) {
    var self = this;    //保存原函数引用
    return function(){  //返回包含了原函数和新函数的 '代理函数'
        beforefn.apply(this, arguments);    //执行新函数,修正this
        return self.apply(this,arguments);  //执行原函数
    }
}
Function.prototype.after = function(afterfn) {
    var self = this;
    return function(){
        var ret = self.apply(this,arguments);
        afterfn.apply(this, arguments);
        return ret;
    }
}
var func = function() {
    console.log('2');
}
//func1和func3为挂载函数
var func1 = function() {
    console.log('1');
}
var func3 = function() {
    console.log('3');
}
func = func.before(func1).after(func3);
func();

私有变量 在对象内部使用’var’关键字来声明,而且它只能被私有函数和特权方法访问。 私有函数 在对象的构造函数里声明(或者是通过var functionName=function(){…}来定义),它能被特权函数调用(包括对象的构造函数)和私有函数调用。 特权方法 通过this.methodName=function(){…}来声明而且可能被对象外部的代码调用。它可以使用:this.特权函数() 方式来调用特权函数,使用 :私有函数()方式来调用私有函数。 公共属性 通过this.variableName来定义而且在对象外部是可以读写的。不能被私有函数所调用。 公共方法 通过ClassName.prototype.methodName=function(){…}来定义而且可以从对象外部来调用。 原型属性 通过ClassName.prototype.propertyName=someValue来定义。 静态属性 通过ClassName.propertyName=someValue来定义。

//构造函数  
  
function myConstructor(message){  
        //公有属性  
    this.myMessage = message;  
        //私有属性  
    var separator = '_';  
    var myOwner = this;  
    //构造函数内私有方法  
    function alertMessage(){  
        alert(myOwner.myMessage);  
    }  
    alertMessage();  
    //特权方法 可以访问构造函数里的私有变量  
    this.appendToMessage = function(string){  
        this.myMessage += separator + string;  
        alertMessage();  
    }  
  }  
  
//公有方法  
  
myConstructor.prototype.clearMessage = function(str){  
   this.myMessage = "";  
}  
  
//静态成员  
myConstructor.name = "jeff";  
  
//静态方法  
myConstructor.alertName = function (){  
  alert(this.name)  
}  
  
var obj = new myConstructor("hello !");  
obj.appendToMessage("kate");  

链接:https://juejin.im/post/59df4f74f265da430f311909 来源:掘金