模拟ExtJS底层继承(原理)
来源:互联网 发布:足球战术 软件 编辑:程序博客网 时间:2024/06/07 12:36
ExtJS底层继承实现的比较完美,既实现了继承父类的模板,又继承了父类的原型对象,又用call,apply实现了子类实例化传参,还只继承了一遍父类的原型对象。其中的原理呢,看下面代码有详细的解释。
// 原型继承的方式:既继承了父类的模板,又继承了父类的原型对象 如 Boy.prototype = new Persion(); //混合继承:原型继承和类继承 // 父类 function Persion(name,age){ this.name = name; this.age = age; } Persion.prototype = { constructor:Persion, //此处可以不这样写 也可以通过Object.defineProperty() sayHello:function () { alert('Hello world'); } } // 子类 function Boy(name,age,sex){ //call apply 实现继承 只复制了父类的模板 //为了更好的解耦 此处Persion = Boy.superClass.constructor Boy.superClass.constructor.call(this,name,age); this.sex = sex; } extend(Boy,Persion); //这个方法就实现了Boy只继承了一遍Persion的原型对象 但是需要在原型对象赋值以后才能调用 否则报sayHello 不是一个function var b = new Boy('c5',27,'男'); for(var i in b){ alert(i);//name age sex sayHello constructor constructor被枚举出来了 也可以通过Object.defineProperty() } alert(b.name)// c5 alert(b.sex)//男 b.sayHello();//Hello world Boy.superClass.sayHello.call(b); //Hello world 可以直接使用父类的方法 alert(Boy.superClass.constructor); //function Persion() {}构造体 //混合继承的缺点:做了3件事:继承父类的2遍模板,继承了1次父类的原型对象 //extend方法优点:做了2件事:继承父类的1遍模板,继承了1次父类的原型对象 function extend(sub,sup) { //目的:实现只继承父类的原型对象 var F = new Function(); //创建一个空函数 目的:空函数进行中转 这一想法不是一般人能想到的 实现中最重要的一步 F.prototype = sup.prototype; // 实现空函数的原型对象和超类的原型对象转换 间接实例F而不是超类 sub.prototype = new F();//原型继承 sub.prototype.constructor = sub;//还原子类的构造器 //保存一下父类的原型对象:一方面方便解耦 另一方面方便获得父类的原型对象 sub.superClass = sup.prototype;//此处实现了保存 自定义一个子类的静态属性 接受父类的原型对象 //判断父级的原型对象的构造器(加保险) if(sup.prototype.constructor == Object.prototype.constructor){ sup.prototype.constructor = sup; //手动还原父类原型对象的构造器 也可以通过Object.defineProperty()的方法更好,constructor属性就不可以枚举出来了。 } }
小博主在这里就说到这些了,希望大家多多交流,互相进步。。。
0 0
- 模拟ExtJS底层继承(原理)
- 经典继承方法实现(模拟extjs底层继承机制)
- ExtJS底层继承机制实现
- 18--26 面向对象程序设计26(模拟extjs底层继承方式)
- javascript原型继承-实现extjs底层继承(2)
- 【Struts2】Struts2底层原理简单模拟
- C++中虚继承的作用及底层实现原理
- Extjs继承
- ExtJs 继承
- 模拟ArrayList底层实现
- 菱形继承引发的问题和解决方案,以及底层实现的原理.
- 模拟继承
- EXTJS中的继承
- extjs 继承记录
- Extjs之组件继承
- EXTJS的继承机制
- extjs实现继承
- EXTJS中的类继承
- jqgrid多字段排序参数
- HttpClient简单使用之POST请求
- JS解析Json中List类型,并遍历List中的对象
- 仿美团详情滑动界面,并兼容NestedScroll嵌套
- JMeter学习笔记1-安装环境
- 模拟ExtJS底层继承(原理)
- 1个鼠标和1个键盘控制2台电脑(windows和linux系统)
- URAL.1033 Labyrinth (DFS)
- 【网络爬虫】HttpClient抓取+解析+存储数据
- hive常用命令
- Codeforces803A Maximal Binary Matrix
- STL顺序容器vector,list和deque
- 集合运算(完成集合的并、交、差(输出被减集合的剩余元素))
- C++11 lambda 表达式解析