JS命名空间、对象封装

欢迎访问个人空间:www.zjxwow.com   Chrome、FireFox 17+ Only

网上有很多关于JS模拟面向对象的课程,如果不能理解下述方法,请自行谷歌!

以下是我总结的一套模拟面向对象套路,已用于生产。

/*
@author:zjx
@version:1.0
*/
var lib = lib || {}; // 命名空间
lib.wgt = lib.wgt || {}; // 命名空间

接下来,演示一个类是如何模拟的:

(function (window, undefined) { 
    // 自定义的私有对象
    var Dater = function (){}
    // 外部可调用的对象
    lib.wgt.Calendar = function(opts){
        return new Calendar(opts); // 调用时省略 new 关键字
    }
    var Calendar = function(){
        this.today = this.opts.today || new Date(); // 属性
    }
    // 公共实例方法
    Calendar.prototype = {
        // 方法:初始化一个日历表
        initPicker: function () {
            // 调用私有实例方法
            initEvent.call(this);
            // 调用私有静态方法
            getMonthList();
        }
    };
    // 私有方法
    function initEvent(){
        console.log(this.today); // 私有方法中调用变量成员
    }
    // 私有静态方法
    function getMonthList(selected){}
    // 公共静态方法
    lib.wgt.Calendar.static = function(){}
})(window);

私有方法的模拟:在该自执行匿名方法中,声明独立的方法以供调用,不利用闭包,内部变量是完全无法被外界获取的。

匿名函数带上window参数的意义在于内部变量如果用到window对象不需要回退到整个文档,定义undefined是因为在一些浏览器中可以被替换。如此定义undefined在Eclipse中貌似会被报错,不过这不打紧。

要调用该类:

var calendar = lib.wgt.Calendar({ // 初始化
	// 各种参数
});
calendar.initPicker(); // 实例方法调用
lib.wgt.Calendar.static(); // 静态方法调用

没有使用new关键字是因为已经在类的构造函数中使用过。

原文地址:https://www.cnblogs.com/zjxwow/p/2865362.html