设计一个模块化扩展功能(define)和使用(use)库

硅谷精英程序员 2017-09-06

设计模式系列课程-设计一个模块化扩展功能(define)和使用(use)库

模块化的诞生标志着javascript开发进入工业时代,近几年随着es6, require js( sea js ), node js崛起,特别是es6和node js自带模块加载功能,给大型程序开发带来了极大的便利。这几个东西没有出来之前,最原始的开发全部是利用全局函数进行封装,如:

设计一个模块化扩展功能(define)和使用(use)库

这种开发方式,非常容易造成一个问题,全局变量污染(覆盖)

如:有个页面需要引入3个js文件( a.js, b.js, c.js ), A程序员在a.js文件中定义了一个函数叫show, B程序员在b.js中也定义了一个函数叫show, 那么引入同一个页面之后,后面的函数会把前面的覆盖,那C程序员引入之后,本来想调用A程序员的show方法,结果被B程序员写的文件给覆盖了,这就很恐怖了,如果这是一个公共方法(核心方法),可能造成系统完全挂掉,那怎么解决呢?早期程序员一般用命名空间,如:

设计一个模块化扩展功能(define)和使用(use)库

这样就有可能大大降低重名的可能性,但是还是会有小部分覆盖的可能性,当然可以在程序中判断,如果存在这个命名空间,就不让定义,但是这样子写,就没有封装性可言,只要引入了js文件,谁都能够操作这些命名空间,也很危险,对于公共接口( 比如获取数据,可以暴露给外部使用),对于一些核心,比较重要的,就要封装起来,不要暴露给外部使用,所以可以通过闭包( 立即表达式)把命名空间中的方法选择性的暴露给外部

设计一个模块化扩展功能(define)和使用(use)库

改进之后,封装性和团队协作开发又得到了进一步的提高,但是依然存在另一个问题,后来的开发者如果要为这个框架新增一个功能模块,而且也能选择性的暴露一些接口怎么办呢?

我们可以封装一个模块扩展功能和模块使用功能,以后要做扩展就非常方便了.

设计一个模块化扩展功能(define)和使用(use)库

设计一个模块化扩展功能(define)和使用(use)库

我们封装了一个define函数,这个函数用来给G模块扩展功能,这里我扩展了一个字符串处理对象,包含了3个方法: trim, trimLeft, trimRight

设计一个模块化扩展功能(define)和使用(use)库

使用的时候,按照命名空间的方式使用即可,我们也可以加一个使用模块的方法use

设计一个模块化扩展功能(define)和使用(use)库

设计一个模块化扩展功能(define)和使用(use)库

设计一个模块化扩展功能(define)和使用(use)库

作者:ghostwu, 出处:http://www.cnblogs.com/ghostwu

相关推荐