JavaScript--Module模式

//module: Module模式是JavaScript编程中一个非常通用的模式

window.onload = function() {
    //1、基本使用：
    var MyFn = function() {
        var age = 24,sex = "boy";//私有变量
        var action = function() {//私有行为
            console.log("it man");
        };
        return {//暴露的公开成员
            work : "orderMonkey",
            action2 : function() {
                console.log("it developer!");
            }
        }
    };
    var newMyFn = new MyFn();
    console.log(newMyFn.action2());
    console.log("===============================");
    //基本用法的缺点：每次使用时都要使用new 关键字生成，这样在内存中每次会copy一份，占用内存，使用闭包可以避免内存问题，实现自执行。也可以实现功能的扩展。

    //2、模块方法：
    var MyFn2 = (function() {
        var my = {};//向外返回的对象
        var age = 25,name = "assassin";
        var action = function() {
            console.log("内部私有成员");
        };
        my.EnglishName = "wanghf";
        my.action2 = function() {
            console.log("major in JavaScript!");
        };//公有代码状态
        return my;
        /*return my = {//向外返回的对象
         work : "It developer",
         action2 : function() {
         console.log("外部成员变量");
         }
         }*/
    })();
    console.log(MyFn2.action2());//调用时避免生成，减小内存占有量
    console.log("===============================");
    //模块方法全局变量的引入和jQuery设计思路一样采用全局传参
    var MyFn3 = (function($) {
        //同上
    })(jQuery);
    //3、模块的扩展：
    //对于大型项目测需要对自己的扩展了，基于上述的思想，同样把自己作为参数传值，进行扩展
    var MyFn2 = (function(my) {//var不是必写，为了统一。
        my.addName = "intelwisd";
        my.addAction3 = function() {
            console.log("扩展的新方法...");
        };
        /*var my1 = {
         addName : "intelwisd",
         addAction3 : function() {
         console.log("外部成员变量");
         }
         };*/ //对象的形式有对象的拷贝之前的会覆盖以前的
        return my;
    })(MyFn2);
    console.log(MyFn2.action2());
    console.log("===============================");
    //4、松耦合扩展和紧耦合扩展
    //松耦合扩展 利用 var MyFn2 = MyFn2 || {};
    var MyFn2 = (function(my) {
        my.addName1 = "intelwisd1";
        my.addAction4 = function() {
            console.log("松耦合扩展的新方法...");
        };
        /*var my = {
         addName: "intelwisd111",
         addAction3: function () {
         console.log("外部成员变量");
         }
         };*/
        return my;
    })(MyFn2 || {});
    console.log(MyFn2.EnglishName);
    console.log(MyFn2.addName1);
    console.log(MyFn2.action2());
    console.log(MyFn2.addAction4());
    //松耦合的优点：确保该对象，在存在的时候直接用，不存在的时候直接赋值为{}
    console.log("===============================");
    //紧耦合扩展 可以实现重载的功能，但要确保加载顺序
    var MyFn2 = (function(my) {
        var addAction4 = my.newAddAction4;
        my.newAddAction4 = function() {//重载函数，以前的函数可以继续使用
            console.log("紧耦合扩展....");
        };
        return my;
    })(MyFn2);
    console.log(MyFn2.addAction4());
    console.log(MyFn2.newAddAction4());
    console.log("===============================");
    //5、克隆与继承 （在紧耦合的基础上进行继承，其实该对象的属性对象或function根本没有被复制，只是对同一个对象多了一种引用而已，所以如果老对象去改变它，那克隆以后的对象所拥有的属性或function函数也会被改变。）
    var MyFn2 = (function(my) {
        var my1 = {}, key;
        for (key in my) {
            if (my.hasOwnProperty(key)) {
                my1[key] = my[key];
            }
        }
        var addAction4 = my1.newAddAction4;
        my1.newAddAction4 = function() {//重载函数，以前的函数可以继续使用
            console.log("紧耦合扩展2....");
            // 克隆以后，进行了重写，当然也可以继续调用以前的
        };
        return my1;
    })(MyFn2);
    console.log(MyFn2.addAction4());
    console.log(MyFn2.newAddAction4());
    console.log("===============================");
    //6、跨文件中的私有成员的共享
    var MyFn3 = (function (my) {
        var _private = my._private = my._private || {},
            _seal = my._seal = my._seal || function () {
                    delete my._private;
                    delete my._seal;
                    delete my._unseal;
                },
            _unseal = my._unseal = my._unseal || function () {
                    my._private = _private;
                    my._seal = _seal;
                    my._unseal = _unseal;
                };
        return my;
    } (MyFn2 || {}));
    //任何文件都可以对他们的局部变量_private设属性，并且设置对其他的文件也立即生效。一旦这个模块加载结束，应用会调用 blogModule._seal()"上锁"，这会阻止外部接入内部的_private。如果这个模块需要再次增生，应用的生命周期内，任何文件都可以调用_unseal() ”开锁”，然后再加载新文件。加载后再次调用 _seal()”上锁”。
    //子模块共有的成员创建
    MyFn2.CommentSubModule = (function () {
        var my = {};
        // ...

        return my;
    } ());
    //eg:
    MyFn3.CommentSubModule = (function () {
        var my = {
            name : "assassin",
            Fn1 : function() {
                alert(0);
            }
        };
        // ...

        return my;
    } ());
}

 

学习来源Tom大叔javascript--Module