javaScript 中的设计模式

一、设计模式的分类

1、创建型设计模式（更好的创建对象、模块）

名称	22
工厂模式	只关心最后的结果
建造者模式	关心创造的过程
原型模式
单例模式
2、结构型设计模式
名称	22
–	–
外观模式	只关心最后的结果
适配器模式	关心创造的过程
装饰者模式
享元模式
桥接模式
3、行为型设计模式（解决模块之间的通信问题）
名称	22
–	–
观察者模式	只关心最后的结果
状态模式	关心创造的过程
职责链模式
访问者模式
迭代器模式
4、技巧型设计模式 （优化代码）
名称	22
–	–
链模式	只关心最后的结果
委托模式	关心创造的过程
节流模式
惰性模式
等待者模式

二、 设计模式的原则

1、单一职责 （把一个大的功能划分成许多个小的功能，每一部分只负责一个功能）
2、对扩展开发对修改关闭
3、 里式替换原则 （组合大于继承）
4、接口隔离原则
5、依赖倒置原则 （忽略）
6、迪米特法则（高内聚低耦合）

三、 代码示例

1、工厂模式

  /*
            工厂模式  
            解决的问题：批量创建对象
            目的：创建对象更方便
            用法   
        */
        function factor(type,word,color) {
            var _factor ={
                js: function (word,color) {
                    var html = "<div class="+ color +">"+ word + "</div>"
                    return html
                },
                php: function (word,color) {
                    var html = "<div class="+ color +">"+ word + "</div>"
                    return html
                }
            }
            var res = _factor[type]();
            return res
        }
        factor('js','js设计模式','red');
        //我们可以通过数组循环的方式循环输出不同的html代码
        var arr = [
            {
                type:'php',
                word:'',
                color:''
            },
            {
                type:'php',
                word:'',
                color:''
            }
        ]
        for (let i = 0; i < arr.length; i++) {
            const element = array[i];
            factor(element.type,element.word,element.color);
        }
        //这样就可以很方便的批量创建了