javascript常见设计模式

设计模式：软件设计过程当中针对特定问题的简洁而优雅的解决方案

---

1.单例模式

单例模式的定义：保证一个类仅有一个实例，并提供一个访问它的全局访问点。实现的方法为先判断实例存在与否，若是存在则直接返回，若是不存在就建立了再返回，这就确保了一个类只有一个实例对象。
适用场景：实现一个单一对象，好比弹窗，不管被建立多少次，只应该有一个实例对象。

class Modal {
    constructor(title, content) {
        this.title = title;
        this.content = content;
    }
}

const getModal = (function () {
    let instance = null;
    return function () {
        if (!instance) {
            instance = new Modal('标题', '文本内容');
        }
        return instance;
    }
})();

let a = getModal();
let b = getModal();

console.log(a === b); // true

---

2. 策略模式

策略模式的目的就是将算法的使用算法的实现分离开来。
策略模式至少由两部分组成：
1.策略类：策略类封装了具体的算法，并负责具体的计算过程，是可变的；
2.环境类：环境类接受客户的请求，随后将请求委托给某一个策略类，不可变；

/*策略类*/
var levelOBJ = {
    "A": function(money) {
        return money * 4;
    },
    "B" : function(money) {
        return money * 3;
    },
    "C" : function(money) {
        return money * 2;
    } 
};
/*环境类*/
var calculateBouns =function(level,money) {
    return levelOBJ[level](money);
};
console.log(calculateBouns('A',10000)); // 40000

---

3. 代理模式

代理模式的定义：为一个对象提供一个代用品或占位符，以便控制对它的访问。
图片懒加载就是一种典型有用场景：

function LazyImg() {}
LazyImg.prototype.getImg = function () {
    var imgNode = document.createElement('img');
    document.body.appendChild(imgNode);
    imgNode.src = './fake.png';
    return imgNode;
}
LazyImg.prototype.setImg = function (src) {
    var imgNode = this.getImg();
    var img = new Image();
    img.onload = function() {
        imgNode.src = this.src;
    }
    img.src = src;
}

var pic = new LazyImg();

cx.setImg('./rel.png');

---

4. 中介者模式

中介者模式的定义：经过一个中介者对象，其余全部的相关对象都经过该中介者对象来通讯，而不是相互引用，当其中的一个对象发生改变时，只须要通知中介者对象便可。经过中介者模式能够解除对象与对象之间的紧耦合关系。
现实生活中，航线上的飞机只须要和机场的塔台通讯就能肯定航线和飞行状态，而不须要和全部飞机通讯。同时塔台做为中介者，知道每架飞机的飞行状态，因此能够安排全部飞机的起降和航线安排。

---

5.装饰者模式

装饰者模式的定义：在不改变对象自身的基础上，在程序运行期间给对象动态地添加方法。