前几天搜索JS继承的时候无意中搜到了..司徒正美的博客..里面的文章太有用了.. 我也是第一次使用博客园
地址 然后看了她的继承一些文章.
现在公司要弄一个社区...我觉得可以使用一个继承框架来管理类.当然也要实现继承.于是乎就开始动工了...
框架简称 Ljs 是学习Js的意思 Learning Javascript google翻译的
继承的主要思路是参考 正美的 还有一些命名是摘用ExtJs的, 刚完成没多久..肯定很多Bug..还没调试
主要功能有:
classname 是类名.包括命名空间 config是类的配置函数
Ljs.define(classname,config) init是构造函数 , inherit是要继承的类,可以是字符串,也可以是类. $static是静态属性和方法(不会被继承),其余的都会被当作对象的属性或方 实现了 $super语法 实列 $super必须放在第一个参数sextends: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 JavascriptLjs 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})();