extjs底层源码实现继承分析
先说明一下在js中一般的继承是怎么写的
var farther=function(name){
this.name=name
};
farther.prototype={
constructor:farther, //还原构造器
id:10
};
var child=function(sex,age){
this.sex=sex;
this.age=age;
}
child.prototype=new farther('tom'); //实现原型继承。
var mychild=new child('男',23);
alert(mychild.name); //tom
alert(mychild.sex); //男
alert(mychild.age);//23
alert(mychild.id);//10
这种js中不符合我们的习惯,我们想要实现实例化的时候,写成这样 var mychild=new child('tom','男',23);
要实现上面这种模式,js有一种在子类引用父类的一种方法,这样父类十分庞大的时候。效率是很低的。下面来看一下ext是怎么实现的。
function myextend(sub , sup){
var F = function() {}, //定义一个空函数做为中转函数
subclassProto, //子类的原型对象
superclassProto = sup.prototype; //把父类的原型对象 交给了superclassProto变量
F.prototype = superclassProto; // 做中转的位置:把父类的原型对象 赋值给了 F这个空函数的原型对象
subclassProto = sub.prototype = new F(); //进行原型继承
subclassProto.constructor = sub; //还原构造器
sub.superclass = superclassProto; //做了一个保存,保存了父类的原型对象
//目的是为了防止你大意了
if (superclassProto.constructor === Object.prototype.constructor) {
superclassProto.constructor = sup;
}
};
myextend(child,farther);
var mychild=new child('tom','男','25');
alert(mychild.name);//tom
alert(mychild.sex);//男
alert(mychild.age);//25
ext巧妙的用了中转函数来实现。
来正式用ext实现继承
Ext.define('father',{
config:{
name:'f1',
age:34
},
say:function(){
alert('father is saying')
},
//给当前定义的类加一个构造器,构造器的用途是接受参数,初始化信息.
constructor:function(config){
var me=this;
me.initConfig(config);
}
});
Ext.define('child',{
extend:'father',
config:{
sex:'男'
},
constructor:function(config){
var me=this;
me.initConfig(config);
}
});
var mychild=Ext.create('child',{
});
alert(mychild.getName()); //f1
alert(mychild.getAge()); //34
mychild.say(); //father is saying
extjs底层源码实现继承分析的更多相关文章
- 总结HashSet以及分析部分底层源码
总结HashSet以及分析部分底层源码 1. HashSet继承的抽象类和实现的接口 继承的抽象类:AbstractSet 实现了Set接口 实现了Cloneable接口 实现了Serializabl ...
- LInkedList总结及部分底层源码分析
LInkedList总结及部分底层源码分析 1. LinkedList的实现与继承关系 继承:AbstractSequentialList 抽象类 实现:List 接口 实现:Deque 接口 实现: ...
- Vector总结及部分底层源码分析
Vector总结及部分底层源码分析 1. Vector继承的抽象类和实现的接口 Vector类实现的接口 List接口:里面定义了List集合的基本接口,Vector进行了实现 RandomAcces ...
- List-LinkedList、set集合基础增强底层源码分析
List-LinkedList 作者 : Stanley 罗昊 [转载请注明出处和署名,谢谢!] 继上一章继续讲解,上章内容: List-ArreyLlist集合基础增强底层源码分析:https:// ...
- List-ArrayList集合基础增强底层源码分析
List集合基础增强底层源码分析 作者:Stanley 罗昊 [转载请注明出处和署名,谢谢!] 集合分为三个系列,分别为:List.set.map List系列 特点:元素有序可重复 有序指的是元素的 ...
- 2018.11.20 Struts2中对结果处理方式分析&struts2内置的方式底层源码剖析
介绍一下struts2内置帮我们封装好的处理结果方式也就是底层源码分析 这是我们的jar包里面找的位置目录 打开往下拉看到result-type节点 name那一列就是我们的type类型取值 上一篇博 ...
- BAT资深工程师 由浅入深分析 Tp5&Tp6底层源码 - 分享
BAT资深工程师由浅入深分析Tp5&Tp6底层源码 第1章 课程简介 本章主要让大家知道本套课程的主线, 导学内容,如何学习源码等,看完本章要让小伙伴觉得这个是必须要掌握的,并且对加薪有很大的 ...
- BAT资深工程师由浅入深分析Tp5&Tp6底层源码☆
第1章 课程简介 本章主要让大家知道本套课程的主线, 导学内容,如何学习源码等,看完本章要让小伙伴觉得这个是必须要掌握的,并且对加薪有很大的帮助. 第2章 [TP5灵魂]自动加载Loader 深度分析 ...
- RocketMQ基础概念剖析,并分析一下Producer的底层源码
由于篇幅原因,本次的源码分析只限于Producer侧的发送消息的核心逻辑,我会通过流程图.代码注释.文字讲解的方式来对源码进行解释,后续应该会专门开几篇文章来做源码分析. 这篇博客聊聊关于Rocket ...
随机推荐
- C#发送邮件三种方法(Localhost,SMTP,SSL-SMTP)
原文:C#发送邮件三种方法(Localhost,SMTP,SSL-SMTP) 最近公司由于一个R&I项目的需要,用户要求在购买产品或出货等一些环节,需要发送邮件提醒或者说每周一让系统自动采集数 ...
- PHP+MYSQL分页原理
1.SQL语句中的limit用法 2.学习分页的一种公式 3.parse_url()解析URL函数 parse_url() 是将URL解析成有固定键值的数组的函数 4.$_SERVER["R ...
- javascript模仿块级作用域(第一篇)
作用域有词法作用域和块级作用域之分,javascript属于词法作用域,而在java.C++中却是块级作用域.在javascript中,只有函数能够创建作用域,作用域是以function作为边界的. ...
- MVC 5 - 将数据从控制器传递给视图
MVC 5 - 将数据从控制器传递给视图 在我们讨论数据库和数据模型之前,让我们先讨论一下如何将数据从控制器传递给视图.控制器类将响应请求来的URL.控制器类是给您写代码来处理传入请求的地方,并从数据 ...
- Python:Module Install Issues
Python里的Module安装过程总有一些奇怪的坑,在此整理一下,以供再遇到此类问题参看 (当然如果这篇文章有人看的话,希望能对你有所帮助~) 目前碰到的主要是以下几种: 0.使用PyCharm 1 ...
- Internal Server Error
Internal Server Error 说句实在的话,学习jQuery的路是很艰难的,解决某此问题的历程与浪费时间太多. 那些痛苦就不在此分享了. 在家里的电脑能够实现<使用jQuery的$ ...
- jsp中获取当前文件路径
<% String path1 = application.getRealPath(request.getRequestURI()); //当前请求的JSP文件的物理路径 String path ...
- Spring3.2 + Hibernate4.2
Spring3.2 + Hibernate4.2 前三篇随笔中介绍了 用原生的JDBC访问数据库.一种高效的数据库连接池druid.用Spring的JDBC框架访问数据库. 本文继续介绍第三种数据库访 ...
- Linq 结果转成 json
public string BindGrid(string page,string rows) { int pageIndex = 0; if ...
- LigerUI权限系统之角色管理
角色管理比前面几个页面都稍显复杂点.好吧,还是先看图. 左边是角色列表,右边是页面列表,它们也是多对多的关系,即一个角色可以访问多个页面,同时一个页面也可以被多个角色访问. 点击左边的角色,刷新右边页 ...