js模块化开发

最新推荐文章于 2024-08-08 18:47:52 发布

我笔记

最新推荐文章于 2024-08-08 18:47:52 发布

阅读量319

点赞数

分类专栏： js 文章标签： js

本文链接：https://blog.csdn.net/y1535623813/article/details/107846552

版权

本文介绍了JavaScript模块化的几种常见方式，包括原始写法、对象写法、立即执行函数写法，以及放大模式和宽放大模式。重点讲解了如何通过立即执行函数实现模块的私有成员保护，并探讨了如何在模块中输入全局变量以保持模块独立性。

摘要由CSDN通过智能技术生成

一、原始写法

模块就是实现特定功能的一组方法。只要把不同的函数（以及记录状态的变量）简单地放在一起，就算是一个模块。　　

function m1(){ 　　　　//... 　　} 　　

function m2(){ 　　　　//... 　　}

上面的函数m1()和m2()，组成一个模块。使用的时候，直接调用就行了。这种做法的缺点很明显："污染"了全局变量，无法保证不与其他模块发生变量名冲突，而且模块成员之间看不出直接关系。

二、对象写法

为了解决上面的缺点，可以把模块写成一个对象，所有的模块成员都放到这个对象里面。　　

var module1 = new Object({ 　　　　
    _count : 0, 　　　　
    m1 : function (){ 　　　　　　//... 　　　　},
    m2 : function (){ 　　　　　　//... 　　　　}
});

上面的函数m1()和m2(），都封装在module1对象里。使用的时候，就是调用这个对象的属性。　　

module1.m1();

但是，这样的写法会暴露所有模块成员，内部状态可以被外部改写。

比如，外部代码可以直接改变内部计数器的值。　　

module1._count = 5;

三、立即执行函数写法

使用"立即执行函数"（Immediately-Invoked Function Expression，IIFE），

关注

专栏目录