`

Extjs 继承的HelloWorld

阅读更多

      用Extjs做了好多的东西,现在回过神来,从基础开始做一下总结:

1、extjs的继承:

 

var BaseClass = Ext.extend(Ext.util.Observable,{
	arr : null,            //这是基类的arr属性。
	abc : function(){     //这是基类的abc函数。
		this.arr = [];
	}
});

var SubClass1 = Ext.extend(BaseClass,{
	subClass1_method: function(){
		SubClass1.superclass.abc.call(this); //回调基类的abc函数。就是唤回父类的方法,进行重写
		this.arr.push(1);
	}
});

var SubClass2 = Ext.extend(BaseClass,{
	subClass2_method : function(){
		SubClass2.superclass.abc.call(this);//回调基类的abc函数。
		this.arr.push(2);
	}
});

(function test(){
	var c1 = new SubClass1();
	c1.subClass1_method();
	alert(c1.arr); //输出1

	var c2 = new SubClass2();
	c2.subClass2_method();
	alert(c2.arr);//输出2
})();
分享到:
评论

相关推荐

    EXTJS入门教程(非常详细)

    在本入门教程中,还包含了简单的示例代码,这些示例代码将演示如何使用ExtJS来创建一个基础的“Hello World”应用程序。这个过程包括了如何设置HTML页面,如何引入必要的ExtJS库文件,以及如何编写JavaScript代码来...

    ExtJS入门教程(超级详细)

    在上述的入门教程中,会详细地介绍如何创建一个简单的hello world程序。这通常涉及到ExtJS中的容器组件(container),面板组件(panel),以及一些简单的用户界面元素。这样的示例有助于初学者快速理解如何在实际...

    learning-Extjs国外第一本Ext译本

    <title>ExtJS2-HelloWorld <link rel="stylesheet" type="text/css" href="ExtJS2/resources/css/ext-all.css" /> <script type="text/javascript" src="ExtJS2/ext-all.js"> Ext.onReady(function() { Ext....

    Extjs入门教程

    接下来,我们可以通过ExtJS创建一个简单的“Hello World”程序。在ExtJS中,每个界面元素都是一个Ext Components(Ext组件),以下是一个创建包含“Hello World!”文本标签的窗口组件的示例: ```javascript Ext....

    精通JS脚本之ExtJS框架.part2.rar

    3.2.3 编写HelloWorld.html 3.2.4 运行调试ExtJS 3.3 辅助开发 3.3.1 调试工具Firebug 3.3.2 开发利器Spket 第4章 ExtJS事件机制 4.1 设计模式——观察者模式 4.2 自定义事件 4.3 浏览器事件 4.4 ExtJS中的...

    ExtJS Basic Training

    编写第一个ExtJS代码——“Hello World”示例,这不仅是熟悉ExtJS API的第一步,也是理解其工作原理的重要起点。 #### 示例:窗口与布局 ExtJS提供了多种布局方式,包括但不限于边界布局、表格布局和适合布局等,...

    深入浅出ExtJS第2版

    1.4 Hello World 2 1.4.1 直接使用下载的发布包 2 1.4.2 在项目中使用EXT 3 1.5 为什么页面提示"找不到图片" 3 1.6 辅助开发 4 1.6.1 调试工具Firebug 4 1.6.2 开发利器Spket 7 1.7 本章小结 10 第2章 EXT...

    Ext入门学习.docx

    ExtJS 的 HelloWorld 项目需要准备以下几个步骤: 1. 下载最新的 ExtJS 版本,目前是 ext-3.3-beta 2. 下载后解压,查看里面的包结构包括 adapter、build、docs、examples、resources、package、source 等 3. 开发...

    extjs的教程里面含有代码列子详解

    - **Hello World示例**:提供一个简单的入门示例,帮助读者了解如何创建第一个EXTJS应用程序。 - **辅助开发工具**:介绍Firebug和Spket等开发工具的使用方法,这些工具可以帮助开发者更高效地调试代码。 #### 第二...

    精通JS脚本之ExtJS框架.part1.rar

    3.2.3 编写HelloWorld.html 3.2.4 运行调试ExtJS 3.3 辅助开发 3.3.1 调试工具Firebug 3.3.2 开发利器Spket 第4章 ExtJS事件机制 4.1 设计模式——观察者模式 4.2 自定义事件 4.3 浏览器事件 4.4 ExtJS中的...

    extjs核心api详解

    // 输出: Hello \(world\) ``` ##### extend(Object subclass, Object superclass, [Object overrides]) 此方法用于让子类继承父类。 **示例代码:** ```javascript Ext.extend(MySubClass, MySuperClass, { ...

    ext入门学习文档

    #### 四、ExtJS 的 HelloWorld 示例 1. **环境准备**: - 下载最新版本的ExtJS(例如ext-3.3-beta)并解压。 - 文件夹结构包括`adapter`、`build`、`docs`、`examples`、`resources`、`package`、`source`等。 -...

    ext入门学习.docx

    在`HelloWorld.html`中,引入必要的CSS和JavaScript文件,然后在`onReady`函数中弹出提示框显示"Hello Ext3.0,你好"。 ```html <!DOCTYPE html> <title>Hello Ext ; charset=gb2312"> ...

    ext入门学习[归类].pdf

    编写第一个ExtJS程序,也就是“Hello World”程序,通常包括设置HTML结构,引入所需的CSS和JavaScript文件。在`Ext.onReady`函数中,你可以添加代码,在页面加载完成后执行,比如弹出一个提示框显示“Hello Ext3.0,...

    ext入门学习.pdf

    编写第一个“Hello World”程序,可以创建一个HTML文件,引入ExtJS的库文件,并在`onReady`函数中设置一个简单的弹窗提示,如下所示: ```html <!DOCTYPE html> <title>Hello Ext3.0 ...

    ext+js深入浅出

    ##### 1.4 HelloWorld示例 - **直接使用下载的发布包**:将EXTJS的发布包解压至本地文件夹,然后通过浏览器打开示例文件即可查看基本的运行效果。 - **在项目中集成EXT**:将EXTJS的相关文件引入到自己的项目中,...

    韩顺平java从入门到精通视频教程(全94讲)学习笔记整理(齐全).doc

    2. **编译**: 执行 `javac HelloWorld.java`。 3. **运行**: 使用 `java HelloWorld`。 ### JDK 安装与配置 1. **下载**: 访问 Sun Microsystems 的官方网站下载 JDK。 2. **安装**: 按照提示完成安装过程。 3. **...

    ArcGISAPIforJavaScript入门.pptx

    开发第一个地图程序“Hello World”是学习API的常见起点。这通常涉及到加载API库,设置地图容器,并添加图层到地图。在开发环境中,可以利用ArcGIS API for JavaScript的帮助文档和智能提示工具,如vsdoc文件,来...

    Ext Js权威指南(.zip.001

    2.3 编写“hello world”程序 / 37 2.4 关于ext.onready / 38 2.5 关于ext.blank_image_url / 40 2.6 关于字体 / 42 2.7 ext js 4语法 / 42 2.8 本地化 / 60 2.9 为本书示例准备一个模板 / 60 2.10 本章小结...

Global site tag (gtag.js) - Google Analytics