JavaScript设计模式-模块化模式

概念

1. 模块化模式最初被定义为一种对传统软件工程中的类提供私有和公共封装的方法。
2. 在JavaScript中，模块化模式用来进一步模拟类的概念，通过这样一种方式：我们可以在一个单一的 对象中包含公共/私有的方法和变量，从而从全局范围中屏蔽特定的部分。
3. 这个结果是可以减少我们的函数名称与在页面中其他脚本区域定义的函数名称冲突的可能性。

例子

第一步：定义一个闭包的模块。
第二步：利用闭包的特性定义一个局部变量，这个局部变量就是这个模块的私有属性。
第三步：同样定义一个局部函数。
第三步：利用return暴露模块内部的私有属性和方法，好处是可以保护模块的私有属性和方法。

 // 定义一个闭包的模块
        const basketModule = (function () {
            // 定义一个私有属性，模块以外是访问不到的
            const basket = []
            // 定义一个私有方法
            function doSomethingPrivate () {
                console.log('basket', basket)
            }
            // 返回写方法，让外面可以通过方法设置和获取私有属性
            return {
                // 这个方法可往私有属性里面加数据
                addItem: function (values) {
                    basket.push(values)
                },
                // 获取私有属性的长度
                getItemCount: function () {
                    return basket.length
                },
                // 把私有方法关联到这里，通过这个方法可以间接访问
                // Public alias to a  private function
                doSomething: doSomethingPrivate
            }
        }())
        basketModule.addItem({a: 1})
        console.log('basketModule.getItemCount()', basketModule.getItemCount())
        basketModule.doSomething()

ES6的模块化

es6新增了class的关键字#,在属性或方法前加#表示私有

class basketModuleClass {
// #代表私有属性
    #basket = []
    #sum() {
    	return #a + #b;
    } 
    addItem (values) {
        this.#basket.push(values)
    }
}

总结

模块化模式就是需要在函数内定义私有属性或方法，同时用公共的方法暴露出私有的属性和方法，即实现了外部可使用，但是又能保护私有属性。

github仓库地址：点击 设计模式例子 查看