前端模块化

在学node.js, 实际上就是基于common.js开发的,所以了解了一下模块化开发。

JS的模块化初衷和所有语言的模块化都是一致的,就是规范化开发。

1.最早期的时候就是原生的js从上到下代码编写执行,

    function fun1(){ //... }
    function fun2(){ //... }

所有的函数和变量都直接放入相应的js文件中。导致的问题就是全局对象Global被污染,函数命名冲突。同时在js文件之间有所依赖时,还要保证文件引入的顺序,文件之间的依赖关系不好管理。

2.为了解决上面的问题,采用了使用对象封装的模式。

    var module1 = {
        property1 : 1,
        property2 : 2,
        fun1 : function(){},
        fun2: function(){}
    }
    obj.fun1();

好处是减少了对全局对象的污染,而新的问题是对象类型的不安全,在外部可以对其内部进行修改。

3.而采用匿名闭包就可以达到隐藏其内部细节的功能。

var module1 =( function () {
    var property1 = 1;
    var property2 = 2;
    function fun1(){};
    function fun2(){};
    return { fun1: fun1, fun2: fun2};
}) ();
module1.fun1();
module1.property1 ; // undefined

4.而考虑到依赖,一种比较典型的方法是JQuery封装风格。

(function(window){
  //代码
  window.jQuery = window.$ = jQuery;
    //通过给window添加属性而暴漏到全局
})(window);

通过匿名函数包装代码,所依赖的外部变量传给这个函数,在函数内部可以使用这些依赖,然后在函数的最后把模块自身暴漏给window。
如果需要添加扩展,则可以作为jQuery的插件,把它挂载到$上。
这种风格虽然灵活了些,但并未解决根本问题:所需依赖还是得外部提前提供、还是增加了全局变量。

5.而最后一个问题,文件的加载。 过多的

你可能感兴趣的:(前端模块化)