JS设计模式之Module（模块）模式、Revealing Module（揭示模块）模式

xavier 发布于2019-08-23 14:40 / 1450人阅读

摘要：模块模式概念模式最初被定义为一种在传统软件工程中为类提供私有和共有封装的方法。应用将暴露的公有指针指向到私有函数和属性上参考设计模式设计模式系列文章设计模式之工厂模式设计模式之单例模式设计模式之外观模式设计模式之模块模式揭示模块模式

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（揭示模块）模式

GPU云服务器云服务器 module模式 Java设计模式之（五）——代理模式 js中module JS设计模式

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/100963.html

Javascript 设计模式 -- Revealing Module（揭示模块）模式

摘要：在模块代码底部，它会很容易指出哪些函数和变量可以被公开访问，从而改善可读性。这是因为私有函数将继续引用私有实现，该模式不适用与公有成员，只适用于函数。引用私有变量的公有对象成员也遵守无补丁规则。这是对Module模式的一个改进版本。方便集中管理公有API，使公有API更简洁清楚。 var myRevealingModule = function () { var priv...

Apollo 2019-08-21 10:23 评论0 收藏0
JS设计模式之Facade（外观）模式

摘要：概念模式为更大的代码提供了一个方便的高层次接口，能够隐藏其底层的真是复杂性。参考设计模式设计模式系列文章设计模式之模块模式揭示模块模式设计模式之单例模式设计模式之外观模式概念 Facade模式为更大的代码提供了一个方便的高层次接口，能够隐藏其底层的真是复杂性。可以把它想成是简化API来展示给其他开发人员。优缺点优点简化接口使用者与代码解耦易于使用缺点存在隐性成本，性...

xiaodao 2019-08-23 13:57 评论0 收藏0
JS设计模式之Singleton（单例）模式

摘要：定义限制类的实例化次数只能是一次。如果该实例不存在的情况下，可以通过一个方法创建一个类来实现创建类的新实例，如果实例已经存在，它会简单返回该对象的引用。适用场景需要频繁实例化然后销毁的对象。频繁访问数据库或文件的对象。定义限制类的实例化次数只能是一次。如果该实例不存在的情况下，可以通过一个方法创建一个类来实现创建类的新实例，如果实例已经存在，它会简单返回该对象的引用。适用场景 ...

SillyMonkey 2019-08-23 14:31 评论0 收藏0
JS设计模式--Factory(工厂)模式

摘要：对解耦是很有用对。设计模式系列文章设计模式之观察者模式发布订阅模式设计模式之工厂模式设计模式之单例模式设计模式之外观模式设计模式之模块模式揭示模块模式工厂模式提供一个通用的接口来创建对象示例 //Car构造函数 function Car(option) { this.doors = option.doors || 4 this.color = option...

UsherChen 2019-08-26 13:35 评论0 收藏0
JS设计模式之Obeserver（观察者）模式、Publish/Subscribe（发布/订阅）模式

摘要：观察者模式定义设计模式中对的定义一个对象称为维持一系列依赖于它观察者的对象，将有关状态的任何变更自动通知给它们。如图模式比较观察者模式则多了一个类似于话题调度中心的流程，发布者和订阅者解耦。 Obeserver（观察者）模式定义《js设计模式》中对Observer的定义：一个对象（称为subject）维持一系列依赖于它（观察者）的对象，将有关状态的任何变更自动通知给它们。《设计模...

荆兆峰 2019-08-26 13:37 评论0 收藏0