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中的一个特定组件,它是EXTJS的扩展插件,用于实现具有多选功能的下拉框。这个组件在处理火狐浏览器兼容性问题上做了优化,解决了在火狐浏览器下...
在ExtJS 4.x框架中,ComboboxTree是一种特殊的组件,它将传统的下拉框与树形结构结合在一起,提供了一种更为灵活的用户输入方式。这种组件在数据选择上非常实用,尤其当数据层级关系复杂时,可以方便地进行多选或...
在EXTJS这个强大的JavaScript框架中,`Ext.Panel`和`TreePanel`是两个非常重要的组件,它们被广泛用于构建复杂的用户界面。这篇文章将探讨如何在这些组件中动态加载本地页面数据,以提升用户体验并实现灵活的数据...
在EXTJS3中,`Ext.PagingToolbar()` 是一个非常重要的组件,用于在大量数据的网格或视图中实现分页功能。这个组件允许用户轻松地浏览和操作大量的记录,而不需要一次性加载所有数据,从而提高了应用程序的性能和用户...
10. **最佳实践**:源码分析也能让我们学习到ExtJS开发的最佳实践,例如如何有效地组织代码,如何优化数据加载,以及如何保持组件的可维护性。 通过深入研究这个"extjs grid.panel 项目 源码",我们可以提升对ExtJS...
`ext-basex.js`是EXTJS的基础组件文件,其中包含了Ajax请求的相关实现。在旧版本中,可能需要对请求选项进行更详细的配置来适应不同的浏览器环境。 在EXTJS中,`Ext.Ajax`对象提供了丰富的配置项和方法,如`params`...
你可以查看`ext-all.js`或`ext-all-debug.js`文件中关于TreePanel、TreeNode和TreeStore的相关代码,了解其内部实现机制。 7. **扩展与工具**: - 使用`Ext.tree.Column`可以为TreePanel添加列,展示更多节点信息...
在ExtJs中,charts.swf作为插件与JavaScript进行通信,通过ActionScript(AS)实现图形渲染。JavaScript通过调用Flash Player的API来传递数据和指令,使charts.swf能够动态生成和更新图表。这种跨平台的交互方式使得...
这一实现过程涉及了ExtJs框架中的一些核心组件使用方法,需要开发者具备一定的ExtJs框架使用基础和JavaScript编程经验。通过上述方法,可以在不直接修改Ext.Ajax.request方法的前提下,实现一个用户友好的等待提示,...
一、EXT JS 源码分析 EXT JS 的源码结构清晰,包括核心库、组件、布局、数据管理、表单元素等模块。通过阅读源码,开发者可以了解到EXT JS如何实现组件化、事件处理、数据绑定等功能,进一步优化自己的代码结构和...
ExtJS 是一个强大的JavaScript库,主要用于构建富客户端的Web应用程序。在3.x版本中,它提供了丰富的用户界面组件和强大的数据绑定机制。本篇将基于"Extjs3.x入门学习"这一主题,深入探讨相关知识点。 1. **EXT_JS...
`Ext.ux.SwfUploadPanel.js`是这样一个基于ExtJS和SwfUpload技术的插件,它实现了多文件上传的功能。这篇文章将深入探讨这个插件的工作原理、主要特点以及如何在实际项目中应用。 首先,`ExtJS`(全称为EXT ...
在Ext JS这个强大的JavaScript框架中,开发者经常使用各种组件来构建富客户端应用,其中包括TextField(文本字段)和DatePicker(日期选择器)。有时,我们可能需要根据应用需求在运行时禁用这些组件的编辑功能,...
### ExtJS 多文件上传 UploadDialog For ExtJS3.x #### 概述 在Web开发领域,特别是使用ExtJS框架进行界面设计时,文件上传功能是必不可少的一部分。然而,随着ExtJS版本的更新,原有的多文件上传组件可能不再兼容...
代码如下: Ext.onReady(function() { Ext.Msg.alert(‘提示’, ‘逗号分隔参数列表’); //这种方式非常常见的 ...接下来认识一下Ext.MessageBox Ext.MessageBox是一个工具类,他继承自Obiect对象,用来生成各种
`ext-3.4.0` 文件可能是ExtJS 3.4.0版本的源码或者库文件,包含所有必要的JavaScript和CSS资源,可以直接在项目中引用。 综上所述,"extjs3.x 官方示例以及chm版api"为开发者提供了一套完整的ExtJS 3.x 学习和开发...
Ext JS源码分析与开发实例宝典光盘源码Ext JS源码分析与开发实例宝典光盘源码Ext JS源码分析与开发实例宝典光盘源码Ext JS源码分析与开发实例宝典光盘源码Ext JS源码分析与开发实例宝典光盘源码Ext JS源码分析与开发...
`PagingTreeLoader.js`文件中包含了`PagingTreeLoader`类的实现,它继承自`Ext.tree.TreeLoader`,并添加了分页相关的逻辑。这个文件是这个功能的核心,通过分析和调试这个文件,你可以更深入地理解其内部机制。 在...
打开并分析这个文件可以帮助我们更好地理解实际项目中跨域的实现方式。 5. 源码与工具: 标签"源码 工具"提示这个话题可能涉及到具体的代码实现和一些辅助工具。在实际开发中,开发者可能需要用到如Postman这样的...
1. **定义插件类**:首先,你需要定义一个新的EXTJS 类,继承自`Ext.AbstractPlugin` 或 `Ext.util.Plugin`,这将是你的插件基类。 2. **初始化插件**:在构造函数中,你可以设置插件的相关配置,并通过`init` 方法...