ExtJS学习------Ext.define的继承extend,用javascript实现相似Ext的继承
(1)Ext.define的继承extend
详细实例:
Ext.onReady(function(){
//Sup Class 父类
Ext.define('Person',{
config:{
name:'bjsxt'
} ,
constructor:function(config){
var me = this ;
me.initConfig(config);
}
});
//Sub Class 子类
Ext.define('Boy',{
//使用Ext的继承
extend:'Person',//直接继承
config:{
sex:'男',
age:20
}
});
var b = Ext.create('Boy',{
name:'张三',
age:25
});
alert('姓名:'+b.name+'--性别:'+b.sex+'--年龄:'+b.age);
});
实例结果:
(2)使用javascript实现类似Ext的继承
实例:
Ext.onReady(function(){
//javascript : prototype(原型) :实现继承
//SupClass
var Person = function(name){
this.name = name;
};
//alert(Person.prototype.constructor); //原型对象的构造器,默认是当前的类的模板
//SupClass prototype object
Person.prototype = {
constructor:Person ,
id:100
}; //SubClass
var Boy = function(name,sex,age){
//借用构造函数继承的方式
Person.call(this,name);
this.sex = sex ;
this.age = age ;
}; //实现原型继承: 继承了父类的模板和父类的原型对象
//Boy.prototype = new Person();
//自己实现extend的方法
function myextend(sub , sup){
var F = function() {}, //定义一个空函数做为中转函数
subclassProto, //子类的原型对象 //把父类的原型对象 交给了superclassProto变量
superclassProto = sup.prototype; // 做中转的位置:把父类的原型对象 赋值给了 F这个空函数的原型对象
//进行原型继承
F.prototype = superclassProto;
subclassProto = sub.prototype = new F();
subclassProto.constructor = sub; //还原构造器
sub.superclass = superclassProto; //做了一个保存,保存了父类的原型对象
//目的是为了防止你大意了
if (superclassProto.constructor === Object.prototype.constructor) {
superclassProto.constructor = sup;
}
};
myextend(Boy ,Person);//自己实现的继承方法
var b = new Boy('李四','男',25);//
/* 注:传统的javascript方法实现继承
* Boy.prototype=new Person('李四');
* var b=new Boy('男',25);
*/
alert('姓名:'+b.name+'--性别:'+b.sex+'--id:'+b.id+'--年龄:'+b.age);
});
实例结果:
ExtJS学习------Ext.define的继承extend,用javascript实现相似Ext的继承的更多相关文章
- Extjs 学习总结-Ext.define自定义类
本教程整理了extjs的一些基本概念及其使用,包括自定义类(Ext.define).数据模型.代理等.本节介绍使用Ext.define自定义类 使用Ext.define自定义类 1. 首先看看js中自 ...
- ExtJs 学习之开篇(-)之define
Ext.onReady(function(){ /** * test1,声明一个类,定义类中的方法 */ Ext.define("demo.Demo",{ ...
- ExtJS 4.2 教程-03:使用Ext.define自定义类
转载自起飞网,原文地址:http://www.qeefee.com/extjs-course-3-define-classes ExtJS 4.2 教程-01:Hello ExtJS ExtJS 4. ...
- Extjs学习笔记--(四,基本函数介绍)
Ext是Extjs的命名空间,为Extjs框架提供唯一的全局变量 这样做可以避免冲突,便于代码维护 1,apply和applyif方法 apply=function(object, config, d ...
- Extjs学习笔记--(二)
1.配置实用Extjs <link href="Extjs/resources/css/ext-all.css" rel="stylesheet" /&g ...
- ExtJS学习笔记:定义extjs类别
类的定义 Ext.define('Cookbook.Vehicle', { Manufacturer: 'Aston Martin', Model: 'Vanquish', getDetails: f ...
- ExtJS4中Ext.onReady、Ext.define、Ext.create
1.Ext.onReady 说明:onReady内的语句块会在页面上下文加载后再执行. 2.Ext.define 说明:创建类,可以继承其他类,也可以被继承. 例子1: 1 <script ty ...
- ExtjS学习--------Ext.define定义类
Ext类Class的配置项:(注:Extjs的 的中文版帮助文档下载地址:http://download.csdn.net/detail/z1137730824/7748893 ExtJS配置文件和演 ...
- ExtJS学习(一)Ext自定义类实现
工作中项目需要extjs,所以学习一下,做个笔记防止遗忘了.以后回忆起来也方便. 首先下载extjs官网地址:http://extjs.org.cn/ 下载以后的目录结构: 先写一个入门的程序吧自定义 ...
随机推荐
- 《ArcGIS Runtime SDK for Android开发笔记》——(5)、基于Android Studio构建ArcGIS Android开发环境(离线部署)(转)
1.前言 在上一篇的内容里我们介绍了基于Android Studio构建ArcGIS Runtime SDK for Android开发环境的基本流程,流程中我们采用的是基于Gradle的构建方式,在 ...
- Oracle 11gR2 RAC 数据库不能连接(ORA-12537: TNS:connection closed)
Oracle 11gR2 RAC 数据库不能连接(ORA-12537: TNS:connection closed)的解决 [oracle@rac01 ~]$ sqlplus /nolog SQL*P ...
- JavaMail入门:创建纯文本、HTML格式的邮件
转自:http://haolloyin.blog.51cto.com/1177454/353849/ 在 http://java.sun.com/products/javamail/ 下载了 Java ...
- postgres10配置huge_pages
操作系统 修改/boot/grub2/grub.cfg 定位到第一个'menuentry 'CentOS Linux',在"linux16 /vmlinuz"最后面添加 numa= ...
- 定制你自己的CRF模型
如何训练自己的CRF模型 Ansj从5.0版本之后支持训练自己的crf模型,在此之前虽然已经很早支持了CRF模型,但是在用户的自训练上要求苛刻,而且本身实现的CRF从性能到准确率都不如CRF++或者第 ...
- latex 三个不同的图放在一行且每个图都有注释
\begin{figure}[htbp] \begin{minipage}[t]{0.3\linewidth} \centering \includegraphics[width=.2.0.eps} ...
- linux下搭建SVN服务器完全手册
原文:http://www.cnblogs.com/wrmfw/archive/2011/09/08/2170465.html 系统环境 RHEL5.4最小化安装(关iptables,关 ...
- mysql备份与还原,增量备份;使用ibd和frm文件恢复数据
主要用的:binlog.mysqldump.mysqlbinlog 参考: https://www.cnblogs.com/Cherie/p/3309456.html https://blog.csd ...
- JAVA HDFS API Client 连接HA
如果Hadoop开启HA,那么用Java Client连接Hive的时候,需要指定一些额外的参数 package cn.itacst.hadoop.hdfs; import java.io.FileI ...
- 在Ubuntu Server上源码安装OpenERP 8.0,并配置wsgi和nginx运行环境
原文: How to install OpenERP 8.0 Alpha on a fresh Debian / Ubuntu server. OpenERP的安装,可以有多种方式,通过添加源,到 h ...