`
kidiaoer
  • 浏览: 818701 次
  • 性别: Icon_minigender_1
  • 来自: 深圳
文章分类
社区版块
存档分类
最新评论

EXT 的继承

阅读更多

Ext提供了这样的一个实用函数 Ext.extend (API 参考) 在EXT框架中实现类继承的机制。这赋予了你扩展任何JavaScript基类的能力,而无须对类自身进行代码的修改(这里通常指的是子类,或是从它继承的,一个基类)扩展Ext组件这是个较理想的方法。

要从一个现有的类创建出一个新类,首先要通过一个函数声明新类的构造器,然后调用新类属性所共享的扩展方法。这些共享的属性通常是方法,但是如果要在实例之间共享数据(例如,Java中的静态类变量),应该也一同声明。

JavsScript并没有提供一个自动的调用父类构造器的机制,所以你必须通过属性superclass在你的构造器中显式调用父类。第一个参数总是this,以保证构造器工作在调用函数的作用域。
view sourceprint?
01.
MyNewClass = function(arg1, arg2, etc) {
02.
// 显式调用父类的构造函数
03.
MyNewClass.superclass.constructor.call(this, arg1, arg2, etc);
04.
};
05.
 
06.
Ext.extend(MyNewClass, SomeBaseClass, {
07.
theDocument: Ext.get(document),
08.
myNewFn1: function() {
09.
// etc.
10.
},
11.
myNewFn2: function() {
12.
// etc.
13.
}
14.
});

下面的一个例子是Ext的实际案例,用于可缩放,拖动元素,X、Y的坐标值指定了对象可在垂直、水平方向拖动的距离。// 创建新类的构造函数
view sourceprint?
01.
Ext.ResizableConstrained = function(el, config){
02.
Ext.ResizableConstrained.superclass.constructor.call(this, el, config);
03.
};
04.
 
05.
// 扩展基类
06.
Ext.extend(Ext.ResizableConstrained, Ext.Resizable, {
07.
setXConstraint : function(left, right){
08.
// 得到父类的属性dd和setXConstraint的引用
09.
this.dd.setXConstraint(left, right);
10.
},
11.
 
12.
setYConstraint : function(up, down){
13.
// 得到父类的属性dd和setYConstraint的引用
14.
this.dd.setYConstraint(up, down);
15.
}
16.
});
17.
 
18.
// 创建新类的实例
19.
var myResizable = new Ext.ResizableConstrained('resize-el', {
20.
width: 200,
21.
height: 75,
22.
minWidth:100,
23.
minHeight:50,
24.
maxHeight:150,
25.
draggable:true
26.
});
27.
 
28.
//调用新方法
29.
myResizable.setYConstraint(0,300);
30.
myResizable.setXConstraint(0,300);

按照直白语言,你可以把上面的代码理解成为:”Ext.ResizableConstrained 扩展了Ext.Resizable并实现了这些方法"。

分享到:
评论

相关推荐

    Ext继承和扩展

    "Ext继承和扩展"是ExtJS中的核心概念,它们是实现代码复用和模块化设计的关键。在这个主题中,我们将深入探讨这两个概念以及它们在实际开发中的应用。 **一、Ext继承** 在面向对象编程中,继承是类之间的一种关系...

    Ext继承和扩展写的例子。

    在这个特定的例子中,我们关注的是"Ext继承和扩展",这是Ext JS中两个核心的概念,它们对于理解和创建自定义组件至关重要。 1. **Ext继承**: 在面向对象编程中,继承是类之间的一种关系,允许一个类(子类或派生...

    ext 继承(extend) 理解练习

    总的来说,`ext继承`(`extend`)是JavaScript中实现继承的一种方式,它通过复制属性和方法以及调整原型链来让一个类能够继承另一个类的特性。这种技术在构建复杂应用时尤其有用,因为它促进了代码的模块化和重用。...

    Ext继承--Ext自定义组件的书写方式

    目的:该示例非常详细注释说明Ext的面向对象的编程方式,使用继承,然后重写父类的方法,以及注册自定义事件说明Ext框架是事件驱动的框架编程。 阅读对象:本中心学习Ext面向对象编程的人员 阅读条件:掌握OO的思路...

    ext继承重写

    在EXT JS这个强大的JavaScript框架中,"继承"和"重写"是两个核心概念,它们在构建可复用和模块化的应用程序中起着至关重要的作用。EXT JS采用面向对象的编程方式,允许开发者通过继承机制来扩展类的功能,同时通过...

    Ext继承分析

    在ExtJS中,`Ext.extend()` 是一个核心的函数,用于实现类之间的继承机制。它允许你创建新的类(子类),这些类将继承另一个类(父类)的属性和方法。这个功能对于构建复杂的JavaScript应用程序至关重要,因为它提供...

    ajax-ext框架

    1. **组件化设计**:Ajax-ext继承了ExtJS的组件化思想,将页面元素封装成可复用的组件,如表格、表单、树形视图等,方便开发者快速构建UI。 2. **数据绑定**:Ajax-ext支持双向数据绑定,使得UI状态与后台数据同步...

    EXT dojochina Ext类继承.rar

    EXT dojochina是一个关于JavaScript库EXTJS的讨论社区,EXTJS是一个强大的前端开发框架,...在EXT dojochina社区中,开发者们分享了大量关于EXTJS类继承的实践经验和技巧,帮助彼此提升技能,共同推进EXTJS技术的发展。

    ext面向对象和继承

    EXTJS中的继承是通过`Ext.extend()`或`Ext.createByAlias()`实现的。继承允许子类重写或扩展父类的方法和属性。例如,我们可以创建一个新的按钮类,继承自EXTJS的`Ext.button.Button`: ```javascript MyButton = ...

    EXT dojochina Ext类静态方法.rar

    例如,`Ext.extend(MyClass, Ext.Panel, {myMethod: function() {...}})`创建了一个新类MyClass,它继承自Ext.Panel,并添加了一个名为myMethod的方法。 - `Ext.apply()`: 这个静态方法用于合并对象的属性,通常...

    Ext框架结构 Ext目录结构

    描述"Ext 2.2 所有类结构继承关系和类说明图"强调了框架中的类层次结构。在面向对象编程中,类的继承是创建新类的一种方式,新类可以从现有类(父类)继承属性和方法。在Ext 2.2中,各个组件和类通常会形成一个复杂...

    Ext官方中文教程(可打包下载)

    Ext的类继承 从源码生成Ext 基础用法: DomQuery基础 Ext中的事件 简述模板 模板(Templates)的函数 教你创建Ext UI控件 事件的处理 Ext中的继承 Ext的类设计 Ajax通讯 JSON处理方法 函数的原型扩展 组件的...

    ext4-exactor.zip

    它继承了EXT3的特性,并引入了一些重要的改进,如更大的文件系统大小、更快的挂载和卸载速度、更高效的元数据操作等。EXT4支持的最大文件系统大小可达16EB(1EB = 1024PB),最大文件大小可达16TB,这使得它非常适合...

    ext5第一部分

    预计EXT5将继承并增强EXT4的一些特性,如大文件支持、快速文件系统挂载和更快的数据访问速度。此外,EXT5可能引入以下几个关键改进: 1. **更大的文件系统和文件大小**:EXT4已经支持最大16TB的文件系统和16TB的...

    Ext.Store的获取方法

    但在使用`extend`进行类继承时,可能会将Store的定义放在一个新的组件内,例如一个ComboBox: ```javascript Leangle.form.combo.ColorComboBox = Ext.extend(Leangle.form.BaseComboBox, { // ComboBox ...

    整理的Ext API详解

    文件中可能涵盖了Ext的应用程序启动、基本类的创建、继承机制、实例化过程以及如何自定义类等内容。学习这部分可以帮助开发者理解Ext如何组织代码和实现模块化。 接着,"EXT核心API详解(二)-Array Date Function ...

    Ext2.2 中文手册

    EXT 中的继承 - **继承概念**:理解 JavaScript 中的继承机制。 - **扩展组件**:通过继承现有组件来创建新组件。 #### 15. 补充资料 - **Ext2 概述**:提供了 Ext2 版本的主要特性和新组件的介绍。 - **组件...

    ext-base.js

    1. **基础对象**:EXT中的所有对象都继承自Ext.Base,这个基类定义了EXT对象的基本行为,如事件处理、属性管理和扩展机制等。 2. **类系统**:EXT使用面向对象的编程方式,"ext-base.js"中包含了类的创建、继承和...

    Ext4.0中文版手册

    5. **日志式文件系统**:EXT4继承了EXT3的日志记录能力,能够在系统崩溃或不正常关机后快速恢复文件系统的完整性,减少了检查文件系统的时间。 6. **数据块群组**:EXT4文件系统中的数据块群组结构进行了优化,使得...

Global site tag (gtag.js) - Google Analytics