Javascript面向对象扩展库

Question

最近一直在用js做项目，遇到了许多需要应用面向对象来设计的功能，由于js对OOP的原生支持还不是很完善，所以就写了一个面向对象的扩展库用做底层支持，现在把它单独整理出来，完善了一些功能，在这里分享一下。
lang.js库提供了包和类的定义、类的继承与混合（mixin）、函数重载等功能，基本可满足大多数面向对象设计的需求。同时支持基于链式的定义方式，让库在使用时更加规范和便捷。下面首先通过简单的例子演示了lang.js的基本功能，之后给出了lang.js的源码及注释。
 
一.功能介绍
“lang”作为框架的全局定义，其中包括了四个方法：
lang.Package(string name) //用于定义包(默认会暴露到全局)
lang.Class(string name[, object config], object classBody) //用于定义类
lang.Object(string name | object body) //用于定义支持重载函数的普通对象
lang.Function(string name | object body) //用于定义重载函数//1.基本的包和类的定义：
//首先通过全局函数Package定义一个包，下面可通过链式调用向包中定义类、对象或函数。Package('com.site').Class('Base',{
    Base: function(tagName){
        this.element = document.createElement(tagName);
    },
    add: function(child){
        this.element.appendChild(child);
    },
    show: function(){
        alert('I am Base!');
    }
}).Class('Control', {
    Control: function(){
        //do soming
    }
});alert(com.site);
alert(com.site.Base);
alert(com.site.Control);
//2.普通对象定义
//一个不需初始化的类，可直接定义成普通对象
Package('com.site.util').Object({
    ModelA: {
        say: function(){
            alert('ModelA: Hello!');
        } 
    },
    ModelB: {
        print: function(){
            alert('ModelB: ' + this.Class.Type.name);
        } 
    }
});
com.site.util.ModelA.say();
//3.类的继承//像很多面向对象语言一样，这里约定一个类只能拥有一个父类。但是可以通过mixin混合多个普通对象。
//在子类的构造函数中可以通过this.base访问父类的构造函数。
//如子类定义了与父类相同函数，父类函数将被重写，这里同样可以通过this.base调用父类被重写的函数。
Package('com.site').Class('Panel', {extend: com.site.Base, mixin:[com.site.util.ModelA, com.site.util.ModelB]}, {
    Panel: function(tagName){
        //这里使用this.base调用父类构造函数
        this.base(tagName);
    },
    show: function(){
        alert('I am Panel!');
        this.base();
    }
});
var panel = new com.site.Panel("div");
panel.say();
panel.print();
alert(panel.element.outerHTML);//4.静态成员的定义
/*
程序中可以将类的主体以函数的形式定义，将私有成员定义在函数内部，将公共成员以返回值的形式暴露出来。这种设计模式在很多流行框架中都可以看到，虽然隐藏的成员只能是静态的，不过这也足以满足大部分的需求了。
公有的静态成员可以通过Static标签定义，Static中可包含一个静态构造函数，该函数只会在类第一次创建的时候执行一次。
在运行期间类的内部可以通过this.Class.xxx的形式访问自身的静态成员，（this.Class就是所属类的引用）
*/Package('com.site').Class('Button', {extend: com.site.Panel}, function(){    //在这里定义私有静态成员
    var tagName = 'BUTTON';
    var onclick = function(){
        alert('I am a Button!');
    }    return {
        //这里定义共有静态成员
        Static: {
            count: 1,
            //静态构造函数
            Button: function(){
                this.createTime = new Date();
            }
        },
        Button: function(text){
            this.base(tagName);
            this.element.innerHTML = text;
            this.element.onclick = onclick;
            //调用静态变量
            this.Class.count++;
        }
    };
});var button = new com.site.Button("Button1");
document.body.appendChild(button.element);
alert(com.site.Button.count);//5.重载函数的定义
/*
lang.js中对函数重载提供了较完善的支持，在定义函数时可在函数名后面指定参数签名，调用函数时程序根据传入的参数自动匹配转发。
其中支持的类型包括：var,string,number,boolean,array,date,object,function,element和自定义的类（var表示任意类型，element表示DOM元素。）
为了保证灵活性，重载支持通配符功能，遵循正则表达式的规则，可以通过标记“+ * ? {?,?}”来处理不确定参数个数的情况。
重载函数在类的继承过程中是有效的，签名不同的函数不会被重写，被重写的父类重载函数同样支持通过this.base调用。
以下代码为重载在类中应用的例子：
*/Package('com.site').Class('Student',{
    Static: {
        //静态函数重载
        'create()': function(){
            //这里的this就是类本身，所以可以直接new
            return new this('静态', 1);
        },
        'create(string, number)': function(name, age){
            return new this(name, age);
        },
        'search()': function(){
            alert('search(*)');
        },
        'search(string)': function(name){
            alert('search('+name+')');
        }
    },
    //构造函数重载
    'Student()': function(){
        //利用this.self调用自身构造函数"Student(string, number)"
        this.self('未知', 0);
    },
    'Student(string, number)': function(name, age){
        this.name = name;
        this.age = age;
    },
    //普通成员函数重载
    'print()': function(){
        this.print(this.name ,this.age);
    },
    'print(string, number)': function(name, age){
        alert('name:' + name + ',age:' + age);
    },
    //支持自定义类的类型
    'print(lib.ui.Panel)': function(panel){
        this.print(panel, true);
    },
    'print(lib.ui.Panel, boolean)': function(panel, append){
        if(append){
            panel.element.innerHTML += this.name;
        }else{
            panel.element.innerHTML = this.name;
        }
    }
}).//继承中对重载的支持
Class('MaleStudent',{extend: com.site.Student},{
    Static: {
        //重写父类静态函数
        'search(string)': function(name){
            alert('MaleStudent: search('+name+')');
        },
        'search(string, number)': function(name, age){
            alert('MaleStudent: search('+name+','+age+')');
        }
    },
    'MaleStudent': function(){
        //调用父类的构造函数"Student(string, number)"
        this.base('未知男同学', 0);
    },
    'MaleStudent(string, number)': function(name, age){
        //调用父类的构造函数"Student(string, number)"
        this.base(name, age);
    },
    //重写了父类的重载函数
    'print()': function(){
        alert('MaleStudent: name:' + this.name + ',age:' + this.age);
    },
    'print(string, number)': function(name, age){
        //通过this.base调用父类函数"print(string, number)"
        this.base('<'+name+'>', '<' + age + '>');
    },
    //模糊匹配，这个函数可接受一个或多个字符串和零个或多个数字
    'print(string+, number*)': function(){
        var msg = [];
        for(var i=0; i<arguments.length; i++){
            msg.push(arguments[i]);
        }
        alert('print(string+, number*):' + msg.join('+'));
    }
});//创建对象时会自动判断调用的构造函数
var studentA = new com.site.Student();
studentA.print();var studentB = new com.site.MaleStudent('王小虎', 19);
studentB.print();
studentB.print('小虎', 19);//这里调用了模糊匹配的重载函数
studentB.print('a','b','c');
studentB.print('x','y','z', 1, 2 ,3);var studentC = new com.site.MaleStudent();
studentC.print();//调用静态重载函数
var student = com.site.Student.create();
student.print();
com.site.Student.search();
com.site.Student.search('某同学');//共有的静态函数会继承到子类，所以MaleStudent也可以create
var maleStudent = com.site.MaleStudent.create('小红', 18);
maleStudent.print();
com.site.MaleStudent.search('小明');
com.site.MaleStudent.search('小明',20);//6.匿名定义
//有些时候，我们不希望显示的指定一个类或函数的名字，只希望把它保存到变量里面，那么可以通过匿名的方式进行定义。//1）使用lang.Class创建匿名类
var clazz = lang.Class({
    //匿名类的名字统一为Anonymous，所以构造函数的名字也要是Anonymous
    Anonymous: function(name){
        this.name = name;
    },
    show: function(){
        alert(this.name);
    }
});alert(clazz);
new clazz('匿名类').show();//2）使用lang.Function创建匿名重载函数
var fn = lang.Function({
    '(default)': function(){
        var a = [].slice.call(arguments, 0);
        alert(a);
    },
    '(string)': function(a){
        alert('(string): ' + a);
    },
    '(string, number)': function(a, b){
        alert('(string, number): ' + a + ':' + b);
    },
    '(number)': function(a){
        alert('(number): ' + a);
    }
});alert(fn);
fn('message');
fn('message', 1);
fn(1);
fn(1,2,3,4,5);//3）使用lang.Object创建支持重载函数的普通对象
var obj = lang.Object({
    name: 'jim',
    'write()': function(){
        this.write(this.name);
    },
    'write(string)': function(name){
        alert(name);
    }
});obj.write();
obj.write('joe');
//7.综合例子
Package("com.site").Class('ClassA', {
    print: function(){
        alert(this.toString());
    }
}).Class('ClassB', {
    print: function(){
        alert(this.toString());
    }
}).Object({
    fn1: function(){
        alert(1);
    },
    fn2: function(){
        alert(2);
    },
    'debug(string)': function(msg){
        alert(msg);
    },
    'debug(string, number)': function(msg, num){
        alert(num + ': ' + msg);
    },
    'debug(com.site.ClassA, string)': function(c, method){
        alert('debug ClassA');
        c[method]();
    },
    'debug(com.site.ClassB, string)': function(c, method){
        alert('debug ClassB');
        c[method]();
    },
    'debug(element)': function(element){
        alert('element:' + element.outerHTML);
    }
}).Object('Web', {
    'reload': function(){
        alert('reload...');
    },
    'reload(function)': function(fn){
        fn();
    }
}).Package('com.site.util').Function('myfn(string)', function(name){
    alert(name);
}).Function('myfn(number)', function(num){
    alert(num*num);
}).Class('ClassA', {
    ClassA: function(){
        alert('ClassA!');
    }
});var div = document.createElement("div");
var span = document.createElement("span");
div.appendChild(span);com.site.fn1();
com.site.fn2();
com.site.debug('info');
com.site.debug('info', 1);
com.site.debug(new com.site.ClassA(), 'print');
com.site.debug(new com.site.ClassB(), 'print');
com.site.debug(div);
com.site.Web.reload();
com.site.Web.reload(function(){alert('callback');});
com.site.util.myfn('Jim');
com.site.util.myfn(100);
new com.site.util.ClassA();
//8.自描述信息
/*
自描述就是类或对象在定义完成后对自身的信息的描述，常常用于实现一些特殊的功能，库中通过Type"保留字"存储类或包的自描述信息。
下面为使用方法：
*/var value = com.site.Student;
alert('判断是否一个类:' + (value.Type && value.Type.type == 'class'));
alert('取完整类名:' + com.site.Student.Type.name);
alert('取父类完整类名:' + com.site.MaleStudent.Type.baseClass.Type.name);
alert('取短类名:' + com.site.Student.Type.shortName);
alert('取一个类的包名:' + com.site.Student.Type.Package.Type.name);
复制代码
结束语：
到这里，lang.js的应用和原理就介绍完毕了，该库在主流浏览器中均已测试通过，
如果想使用lang.js，可以在这里免费下载，如发现什么问题，或有好的建议可以反馈给我。