js设计模式

简单工厂设计模式

class Person {
    constructor(name) {
        this.name = name
    }
    getName() {
        console.log(this.name)
    }
}
class Factory {
    static create(name) {
        return new Person(name)
    }
}
Factory.create('alanwu').getName()  //alanwu

单例模式

var Singleton = function (name) {
    this.name = name;
}
​
Singleton.prototype.getName = function () {
    console.log(this.name);
}
​
Singleton.getInstance = (function(){
        var instance = null;
        return function(name){
            if(!instance){
                instance = new Singleton(name);
            }
            return instance;
        }
    }
)()
​
var a = Singleton.getInstance('alan1');
var b = Singleton.getInstance('alan2');
​
console.log(a===b); //true

发布订阅模式

document.addEventListener('click', () => {
    console.log("You click me!");
},false)
​
document.addEventListener('wheel', () => {
    console.log("Your wheel!");
},false)

策略模式

var strategies = {
    "rich": function () {
        console.log("You can go with plane!");
    },
    "poor": function () {
        console.log("OH, You can go with your feet!");
    },
    "middle": function () {
        console.log("You can go with train!");
    }
}
var howShouldGo = function (money) {
    return strategies[money]();
}
console.log(howShouldGo("rich"));

迭代器模式

var myForEach = function (arr, callback) {
    for (var i = 0, l = arr.length; i < l; i++) {
        callback.call(arr[i], i, arr[i]) //把元素以及下标传递出去
    }
}f
​
myForEach([1, 2, 3], function (item, n) {
    console.log([item, n]);
})
//[ 0, 1 ]
//[ 1, 2 ]
//[ 2, 3 ]