javascript 对象的设计模式

Posted 2021-01-21 实践出真知

1、为什么学习设计模式：http://www.iteye.com/news/32092   或  https://blog.csdn.net/pigpigpig4587/article/details/48630223  ( 设计模式的作用是让人们写出可复用和可维护的程序)

2、浅谈JS的一些设计模式 ： https://www.jianshu.com/p/010071439eaa

3、javascript设计模式 ： https://www.cnblogs.com/chenxygx/p/5754101.html

4、常用的javascript设计模式  ： https://www.cnblogs.com/xianyulaodi/p/5827821.html （这个比较详细） 或  https://www.cnblogs.com/imwtr/p/9451129.html

5、设计模式的分类：https://segmentfault.com/a/1190000017787537?utm_source=tag-newest  或 https://www.cnblogs.com/polk6/p/9369079.html

模式分类	名称
创建型	工厂模式
	单例模式
	原型模式
结构型	适配器模式
	代理模式
行为型	策略模式
	迭代器模式
	观察者模式(发布-订阅模式)
	命令模式
	状态模式

　　说明：从表可以看出，设计模式并不是只有对象创建 或 函数 调用的 设计模式。设计模式是对程序开发中一些 代码 的总结 归纳 提炼出来的 一种 行之有效的 设计。

　　　　　创建型设计模式：专注于处理对象创建的机制，以合适的方式创建对象，以此来降低创建对象过程的复杂性。

　　　　　　　　　    包含：Constructor(构造器)、Factory(工厂)、Abstract(抽象)、Prototype(原型)、Singleton(单例)、Builder(生成器)。

　　　　    结构性设计模式：在不同对象之间寻找共同点，并建立一定的关系；确保在系统某一部分发生改变时，系统的整体结构不需要同时改变。

　　　　　　　　　　包含：Dectorator(装饰着)、Facade(外观)、Flyweight(享元)、Adapter(适配器)、Proxy(代理)。

　　　　　行为型设计模式：改善或简化系统中不同对象之间的通信。

　　　　　　　　　　包含：Iterator(迭代器)、Mediator(中介者)、Observer(观察者)、Visitor(访问者)。

总结：

 　  1、功能复杂的时候，考虑扩展性的时候，模块解耦，就要考虑使用设计模式。设计模式，其实就是一种 代码套路。

　　2、单例，发布订阅，适配器 用的比较多。

　　3、基本是造轮子的时候会使用到，平时都不太考虑这个。

 

 

---

 

6、单例模式 ：

　　使用场景：

   　　    单例模式是一种常用的模式，有一些对象我们往往只需要一个，比如全局缓存、浏览器的window对象、loading效果。在js开发中，单例模式的用途同样非常广泛。试想一下，当我们

　　       单击 右上角登录按钮的时候，页面中会出现一个登录框 (这个组件不能事先创建好，使用显隐控制。因为只有未登入的用户才会需要创建)，而这个浮窗是唯一的，无论单击多少次登录按钮，这个浮窗只会被创建一次。因此这个登录浮窗就适合用单例模式。

var single = (function(){
    var unique;

    function getInstance(){
　　　　// 如果该实例存在，则直接返回，否则就对其实例化
        if( unique === undefined ){
            unique = new Construct();
        }
        return unique;
    }

    function Construct(){
        // ... 生成单例的构造函数的代码
    }

    return {
        getInstance : getInstance
    }
})();

View Code

　　上面是 参考链接中 构造函数单例模式的 创建。基于这种单例模式，可以变成只执行一次函数的  单例模式 。

    var single = (function(){
        var unique;     // 返回的函数中有指向 unique变量，所以函数执行完毕后，这个变量还是保存在内存中的。
        function getInstance(){
    　　　　// 如果该实例存在，则直接返回，否则就对其实例化
            if( unique === undefined ){
                unique = construct();
            }
            return unique;
        }
        function construct(){
            // ... 执行一次 功能的代码
            console.log(\'uu\');
            return true;
        }
        return getInstance;
    })();

　　个人总结：单例模式，利用了闭包的特性。函数执行完，但是函数内某些变量没有被回收的特点。             为什么闭包函数中 某些变量不被回收的原理 参考：https://www.cnblogs.com/wfblog/p/8951886.html

 

 

 

 

 

---