Module(模块)模式

概念

Module模式最初被定义为一种在传统软件工程中为类提供私有和共有封装的方法。

通过这种方式,能够使一个单独的对象拥有共有/私有方法和变量,从而屏蔽来自全局作用局的特殊部分。
产生的结果是: 函数名与在页面上其他脚本定义的函数冲突的可能性降级

应用

实现一个简单的计数器

orderModule外的代码无法直接读取getNum(),addNum()和subNum(),orderNum变量实际上是与全局作用域隔离的,因此它表现的就像是一个四有变量,他的存在被局限于模块的闭包内,因此唯一能访问其作用域的代码就是这三个函数。

这样实现同时也进行了有效的命名空间设置。

var orderModule = (function() {
    var orderNum = 1;

    return {
        getNum: function() {
            return orderNum;
        },
        addNum: function() {
            orderNum = orderNum + 1;
        },
        subNum: function() {
            orderNum = orderNum > 1 ? orderNum - 1 : orderNum;
        }
    }
})();

orderModule.getNum();

Revealing Module(揭示模块)模式

概念

揭示模块模式是在模块模式的基础上进行改进,在私有范围内简单定义所有的函数和变量,并返回一个匿名对象,它拥有指向私有函数的指针,该函数是展示为共有的方法。

应用

var orderModule = (function() {
    var orderNum = 1;
    
    function getNum() {
        return orderNum;
    }
    
    function addNum() {
       orderNum = orderNum + 1;
    }
    
    function subNum() {
        orderNum = orderNum > 1 ? orderNum - 1 : orderNum;
    }

    //将暴露的公有指针指向到私有函数和属性上
    return {
        get: getNum,
        add: addNum,
        sub: subNum
    }
})();

orderModule.get();

参考

《JavaScript设计模式》

JS设计模式系列文章

JS设计模式之Factory(工厂)模式
JS设计模式之Singleton(单例)模式
JS设计模式之Facade(外观)模式
JS设计模式之Module(模块)模式、Revealing Module(揭示模块)模式


大海怪
95 声望12 粉丝