前几天搜索JS继承的时候无意中搜到了..司徒正美的博客..里面的文章太有用了.. 我也是第一次使用博客园
地址 http://www.cnblogs.com/rubylouvre/ 然后看了她的继承一些文章.
现在公司要弄一个社区...我觉得可以使用一个继承框架来管理类.当然也要实现继承.于是乎就开始动工了...
框架简称 Ljs 是学习Js的意思 Learning Javascript google翻译的
继承的主要思路是参考 正美的 还有一些命名是摘用ExtJs的, 刚完成没多久..肯定很多Bug..还没调试
主要功能有:
classname 是类名.包括命名空间 config是类的配置函数
Ljs.define(classname,config)
init是构造函数 , inherit是要继承的类,可以是字符串,也可以是类. $static是静态属性和方法(不会被继承),其余的都会被当作对象的属性或方
实现了 $super语法 实列 $super必须放在第一个参数s
extends:function($super,params1...paramsN){
框架会自动判断子类是否有$super参数
$super() //即父类的方法
do something
}
Ljs.using(classname[,alias]) 主要是引入类到全局中,alias讲类更换的别名 示列
Ljs.define("n.myTestClass",{...}); //创建了一个类 默认是创建到 Ljs.classes空间下..所以要使用类的时候需
var m = new Ljs.classes.n.myTestClass()
但是使用 Ljs.using("n.myTestClass") 后即可 var m = new myTestClass()
使用 alias 参数 Ljs.using("n.myTestClass","cls"); 后 var m = new cls();s
继承部分大致就这些
/*
Learning Javascript
Ljs by 黑子
*/
(function () {
//#region 常用方法
if (typeof Ljs === "undefined") {
window.Ljs = {};
} else { return; }
Ljs.copy = function (obj, config, deft, hasOwn) {
if (deft) { Ljs.copy(obj, deft, hasOwn) }
if (obj && config) {
for (var k in config) {
if (!hasOwn || config.hasOwnProperty(k)) {
obj[k] = config[k];
}
}
}
};
Ljs.copy(Ljs, {
copyIf: function (obj, config) {
for (var k in config) {
if (obj[k] === undefined) {
obj[k] == config[k];
}
}
},
classes: {},
$: function (s) {
return document.getElementById(s);
}
});
Ljs.Function = {
alias: function (Met, Obj) {
return function () {
Met.apply(Obj, arguments);
}
}
}
Ljs.alias = Ljs.Function.alias;
Ljs.Array = function (arg) {
return Array.prototype.slice.call(arg);
}
Ljs.copy(Ljs.Array, {});
Ljs.namespaces = {
ns: function (name, obj) {
name = name.split(".");
var cDom = Ljs.classes;
for (var i = 0; i < name.length; i++) {
var cName = name[i];
if (obj && i == name.length - 1) {
if (cDom[cName]) {
Ljs.copy(obj, cDom[cName], true)
}
cDom[cName] = obj;
} else if (!cDom[cName]) {
cDom[cName] = {};
}
cDom = cDom[cName];
}
return cDom;
},
using: function (name, al) {
name = name.split(".");
var cDom = Ljs.classes;
for (var i = 0; i < name.length; i++) {
var cName = name[i];
if (!cDom[cName]) { alert("引入的类不存在"); return; }
cDom = cDom[cName];
}
cName = al || cName;
if (window[cName] === cDom) return;
if (window[cName]) {
alert("当前已被引用,请换别名");
return;
}
window[cName] = cDom;
},
getClass: function (name) {
name = name.split(".");
var cDom = Ljs.classes;
for (var i = 0; i < name.length; i++) {
var cName = name[i];
if (!cDom[cName]) { alert("继承的类不存在"); return; }
cDom = cDom[cName];
}
return cDom;
}
}
Ljs.using = Ljs.namespaces.using;
Ljs.ns = Ljs.namespaces.ns;
Ljs.browser = function () {
var ua = navigator.userAgent.toLowerCase();
var check = function (regex) {
return regex.test(ua);
},
docMode = document.documentMode,
isOpera = check(/opera/),
isOpera10_5 = isOpera && check(/version\/10\.5/),
isChrome = check(/\bchrome\b/),
isWebKit = check(/webkit/),
isSafari = !isChrome && check(/safari/),
isSafari2 = isSafari && check(/applewebkit\/4/),
isSafari3 = isSafari && check(/version\/3/),
isSafari4 = isSafari && check(/version\/4/),
isIE = !isOpera && check(/msie/),
isIE7 = isIE && (check(/msie 7/) || docMode == 7),
isIE8 = isIE && (check(/msie 8/) && docMode != 7 && docMode != 9 || docMode == 8),
isIE9 = isIE && (check(/msie 9/) && docMode != 7 && docMode != 8 || docMode == 9),
isIE6 = isIE && check(/msie 6/),
isGecko = !isWebKit && check(/gecko/),
isGecko3 = isGecko && check(/rv:1\.9/),
isGecko4 = isGecko && check(/rv:2\.0/),
isFF3_0 = isGecko3 && check(/rv:1\.9\.0/),
isFF3_5 = isGecko3 && check(/rv:1\.9\.1/),
isFF3_6 = isGecko3 && check(/rv:1\.9\.2/),
isWindows = check(/windows|win32/),
isMac = check(/macintosh|mac os x/),
isLinux = check(/linux/),
scrollWidth = null;
return {
docMode: docMode,
isOpera: isOpera,
isOpera10_5: isOpera10_5,
isWebKit: isWebKit,
isChrome: isChrome,
isSafari: isSafari,
isSafari3: isSafari3,
isSafari4: isSafari4,
isSafari2: isSafari2,
isIE: isIE,
isIE6: isIE6,
isIE7: isIE7,
isIE8: isIE8,
isIE9: isIE9,
isGecko: isGecko,
isGecko3: isGecko3,
isGecko4: isGecko4,
isFF3_0: isFF3_0,
isFF3_5: isFF3_5,
isFF3_6: isFF3_6,
isLinux: isLinux,
isWindows: isWindows,
isMac: isMac
}
} ();
//#endregion
//#region 继承机制
var Class = Ljs.Class = function (config) {
config = config || {};
var init = config.init || function () { };
var superclass = config.inherit || Object;
var $static = config.$static || {};
delete config.init;
delete config.inherit;
delete config.$static;
var $class = Class.bridge(superclass, init); //封装原始构造函数
Class.superSyntax($class.prototype, config); //添加方法|属性并实现$super语法
Ljs.copy($class, $static); //给类添加静态方法 || 属性
return $class;
}
Ljs.copy(Ljs.Class, {
reSuper: /function(?:\s+)?\(.*(\$super)+.*?\)/g,
bridge: function (superclass, initialize) {
var cls = function () {
superclass.apply(this, arguments);
initialize.apply(this, arguments);
}
var f = function () { }
f.prototype = superclass.prototype;
cls.prototype = new f();
cls.prototype.superclass = superclass;
cls.prototype.constructor = cls;
cls.superclass = superclass;
cls.constructor = initialize;
return cls;
},
superSyntax: function (obj, options) {
for (var k in options) {
if (options.hasOwnProperty(k)) {
if ((obj[k] != undefined) && (typeof (options[k]) === "function") && (Class.reSuper.test(options[k].toString()))) {
var kk = k;
obj[kk] = function () {
var $super = Ljs.alias(this.superclass.prototype[kk], this);
return options[kk].apply(this, Array($super).concat(Ljs.Array(arguments)));
}
} else {
obj[k] = options[k];
}
}
}
}
});
var Manager = Ljs.ClassManager = {
define: function (classname, config) {
///
/// Ljs.define(classname,config) 创建自定义类并放入Ljs命名空间下
///
///
/// classname 类名 包括命名空间 namespace.youclass
///
///
/// config 配置文件 init 类的构造函数 , inherit 继承的父类 $static 类的静态方法和属性 其余都为类的方法
///
if (classname == undefined) throw ("缺少类名");
config.classname = classname;
if (typeof config.inherit === "string") {
config.inherit = Manager.getClass(config.inherit)
}
var newClass = Ljs.Class(config);
Ljs.namespaces.ns(classname, newClass);
return newClass;
},
getClass: Ljs.namespaces.getClass
}
Ljs.define = Ljs.ClassManager.define;
//#endregion
})();