ext中有关继承的实现的关键代码如下:(Ext.js中)
extend:
extend : function(){
// inline overrides
var io = function(o){
for(var m in o){
this[m] = o[m];
}
};
var oc = Object.prototype.constructor;
return function(sb, sp, overrides){
if(typeof sp == 'object'){
overrides = sp;
sp = sb;
sb = overrides.constructor != oc ? overrides.constructor : function(){sp.apply(this, arguments);};
}
var F = function(){}, sbp, spp = sp.prototype;
F.prototype = spp;
sbp = sb.prototype = new F();
sbp.constructor=sb;
sb.superclass=spp;
if(spp.constructor == oc){
spp.constructor=sp;
}
sb.override = function(o){
Ext.override(sb, o);
};
sbp.override = io;
Ext.override(sb, overrides);
sb.extend = function(o){Ext.extend(sb, o);};
return sb;
};
}()
override:
override : function(origclass, overrides){
if(overrides){
var p = origclass.prototype;
for(var method in overrides){
p[method] = overrides[method];
}
}
}
Ext.apply:
Ext.apply = function(o, c, defaults){
if(defaults){
// no "this" reference for friendly out of scope calls
Ext.apply(o, defaults);
}
if(o && c && typeof c == 'object'){
for(var p in c){
o[p] = c[p];
}
}
return o;
};
最关键的是extend部分的代码,它使得如果子类没有constructor(或者说子类的constructor就是个默认的Object),那么当new一个子类的时候,会调用他的父类的构造器,因此,我们看到Panel是直接通过Ext.Panel = Ext.extend(Ext.Contailer,{...});的方式直接定义的,在new Panel({...})的时候就能层层进去一直到有构造器的超类Ext.Component,并执行这个超类的构造器里的代码。而Ext.Component的构造器代码中有this.initComponet()方法,这样就能够调用子类的initComponent()方法,而子类的initComponent()方法中都有 子类名.superclass.initComponent();这样的代码来调用父类的init方法,这样我们在new一个子类的后就能够直接初始化了所有的信息。
extend中最关键的一句话是:
sb = overrides.constructor != oc ? overrides.constructor :
function(){sp.apply(this, arguments);};
它表示了执行父类构造器的原因,
new对象时,就是执行这个function(){sp.apply(this, arguments);}方法,
sp.applay()执行时,父类构造器就会马上被执行。
比较并执行下面的代码就可以理解了上面说的内容了:
1、子类有构造器的情况
Parent = function() {
alert("parent");
};
Child = function() {
alert("child");
};
Ext.extend(Child, Parent, {
init : function() {
alert("child's init function");
}
});
var cl = new Child();// 输出结果:child
cl.init();// 输出结果:child's init function
2、子类没有构造器的情况
Parent = function() {
alert("parent");
};
Child = Ext.extend(Parent, {
init : function() {
alert("child's init function");
}
});
var cl = new Child();// 输出结果:parent
cl.init();// 输出结果:child's init function
分享到:
相关推荐
extjs多选下拉框,Ext.ux.form.LovCombo,extjs 以修复多选下拉框火狐下取不到值的问题,火狐下div不显示背景色的问题
Extjs4 comboboxTree下拉树型菜单,完美支持多选、单选,绝对好用。来源于网络,稍作修改。
基于extjs form表单的项目源码
ExtJs charts.swf源码 2.6和2.8
extjs-basex.js extjs-basex.js extjs-basex.js
代码如下: Ext.onReady(function() { Ext.Msg.alert(‘提示’, ‘逗号分隔参数列表’); //这种方式非常常见的 ...接下来认识一下Ext.MessageBox Ext.MessageBox是一个工具类,他继承自Obiect对象,用来生成各种
Ext JS源码分析与开发实例宝典光盘源码Ext JS源码分析与开发实例宝典光盘源码Ext JS源码分析与开发实例宝典光盘源码Ext JS源码分析与开发实例宝典光盘源码Ext JS源码分析与开发实例宝典光盘源码Ext JS源码分析与开发...
关于这个原因有很多种,我只说下我遇到的 我这样 写Store来复用的 代码如下: DocStore = Ext.extend(Ext.data.Store,{ initComponent:function(){ this.proxy = new Ext.data.HttpProxy({url:this.url}); this....
NULL 博文链接:https://maoyi606.iteye.com/blog/1782825
NULL 博文链接:https://sonckchi.iteye.com/blog/1958861
14.1 利用Ext.extend实现继承 14.2 与ExtJS扩展相关的预备知识 14.2.1 定义命名空间 14.2.2 使用xtype 14.3 用户扩展和插件 14.3.1 编写自定义用户扩展 14.3.2 常用插件UploadDialog 14.3.3 常用插件...
主要介绍了ExtJs的Ext.Ajax.request实现waitMsg等待提示效果,需要的朋友可以参考下
14.1 利用Ext.extend实现继承 14.2 与ExtJS扩展相关的预备知识 14.2.1 定义命名空间 14.2.2 使用xtype 14.3 用户扩展和插件 14.3.1 编写自定义用户扩展 14.3.2 常用插件UploadDialog 14.3.3 常用插件...
Ext+JS源码分析与开发实例宝典.pdf,清晰完整版。彭仁夔 编著,2010.1 。该书共6个part,全部下载才能RAR解压。所有下载链接去这里找http://stephegn.download.csdn.net/ 全面剖析Ext JS 3.0的架构原理 透彻体悟...
[深入浅出Ext.JS].徐会生等.扫描版.一本比较ExtJS入门级教材。对学习EXTJS有帮助。
extjs 可编辑的表格树,每个单元格自定义编辑组件,可以自适应列宽,只有源码与例子,运行实例要修改路径,不然图片不能显示,注意etree.jsp的js引入路径 支持Ext2.x以上版本 如运行不了EmailTo : codeme9@gmail....
Ext Extjs 禁止文本和日期编辑 ExtJS中动态设置TextField的readOnly属性
EXTjs的上传组件
ExtJS Ext ExtJavascript Javascript
如何给Ext.panel增加一个背景图片