Extjs中使用extend(js继承) 的代码


Posted in Javascript onMarch 15, 2012

注:抄<深入浅出Extjs>书
传统的js实现继承操作为:
一:定义一个父类

var BaseClass = function(){ 
//..... 
}; 
BaseClass.prototype.someMethod = function(){ 
//..... 
}; 
BaseClass.prototype.overridenMethod = function(){ 
//.... 
}

为BaseClass定义两个函数someMethod 和overridenMethod ,,然后定义一个subClass子类,可以直接从BaseClass中继承所有的属性和函数,
var subClass = function(){ 
BaseClass.call(this); 
}; 
subClass.prototype = new BaseClass(); 
subClass.prototype.newMethod = function(){ 
//... 
}; 
subClass.prototype.overridenMethod = function(){ 
//... 
}

在上面的代码中,subClass的构造函数首先调用BaseClass的构造函数初始化数据,然后通过subClass.prototype = new BaseClass();这条语句让subClass类获得BaseClass中的所有属性和函数。这样就实现了继承。在此之后我们就可以操作subClass的prototype,为子类添加新的函数或者覆写父类的同名函数。
在EXT中使用Ext.extend()函数实现继承功能的方法:
var subClass = function(){ 
subClass.superclass.costructor.call(this); 
}; 
Ext.extend(subClass, BaseClass,{ 
newMethod: function(){ 
//... 
}, 
overridenMethod : function(){ 
//.... 
} 
});

在Ext.extend()函数通过 subClass.superclass.costructor.call(this);就可以直接调用父类的构造函数。这个函数的第一个参数总是this, 以确保父类的构造函数在子类的作用域里工作。
如果父类的构造函数需要传入参数,我们也就可以将所需要的参数直接传给它,如:
subClass.superclass.costructor.call(this, config);
这样我们就得到了一个继承了父类的所有属性和函数的子类。
Javascript 相关文章推荐
jQuery对象与DOM对象之间的转换方法
Apr 15 Javascript
JS保留小数点(四舍五入、四舍六入)实现思路及实例
Apr 25 Javascript
window.event.keyCode兼容IE和Firefox实现js代码
May 30 Javascript
javascript 弹出的窗口返回值给父窗口具体实现
Nov 23 Javascript
利用JavaScript实现新闻滚动效果(实例代码)
Nov 27 Javascript
jquery实现弹出层登录和全屏层注册特效
Aug 28 Javascript
详解JavaScript权威指南之对象
Sep 27 Javascript
jQuery完成表单验证的实例代码(纯代码)
Sep 30 jQuery
微信小程序button组件使用详解
Jan 31 Javascript
Vue.js自定义指令学习使用详解
Oct 19 Javascript
JavaScript中如何对多维数组(矩阵)去重的实现
Dec 04 Javascript
vue 中 get / delete 传递数组参数方法
Mar 23 Vue.js
JQuery一种取同级值的方式(比如你在GridView中)
Mar 15 #Javascript
ASP.NET MVC中EasyUI的datagrid跨域调用实现代码
Mar 14 #Javascript
javascript 进阶篇3 Ajax 、JSON、 Prototype介绍
Mar 14 #Javascript
javascript 进阶篇2 CSS XML学习
Mar 14 #Javascript
javascript 进阶篇1 正则表达式,cookie管理,userData
Mar 14 #Javascript
javascript 基础篇4 window对象,DOM
Mar 14 #Javascript
javascript 基础篇3 类,回调函数,内置对象,事件处理
Mar 14 #Javascript
You might like
PHP获取类中常量,属性,及方法列表的方法
2009/04/09 PHP
PHP函数import_request_variables()用法分析
2016/04/02 PHP
php实现微信企业号支付个人的方法详解
2017/07/26 PHP
Ajax中的JSON格式与php传输过程全面解析
2017/11/14 PHP
yii2.0框架多模型操作示例【添加/修改/删除】
2020/04/13 PHP
PHP中SESSION过期设置
2021/03/09 PHP
JAVASCRIPT IE 与 FF中兼容问题小结
2009/02/18 Javascript
关于跨站脚本攻击问题
2011/12/22 Javascript
js中符号转意问题示例探讨
2013/08/19 Javascript
JS判断、校验MAC地址的2个实例
2014/05/05 Javascript
jQuery+ajax实现鼠标单击修改内容的方法
2014/06/27 Javascript
JavaScript中获取鼠标位置相关属性总结
2014/10/11 Javascript
jQuery同步提交示例代码
2015/12/12 Javascript
使用javaScript实现鼠标拖拽事件
2020/04/03 Javascript
javascript基于定时器实现进度条功能实例
2017/10/13 Javascript
Angular6笔记之封装http的示例代码
2018/07/27 Javascript
Vue.js 时间转换代码及时间戳转时间字符串
2018/10/16 Javascript
解决layui数据表格排序图标被超出的表头挤出去的问题
2019/09/19 Javascript
在vue中created、mounted等方法使用小结
2020/07/21 Javascript
Python实现完整的事务操作示例
2017/06/20 Python
python导包的几种方法(自定义包的生成以及导入详解)
2019/07/15 Python
Python+AutoIt实现界面工具开发过程详解
2019/08/07 Python
python分布式计算dispy的使用详解
2019/12/22 Python
python关于调用函数外的变量实例
2019/12/26 Python
django 解决model中类写不到数据库中,数据库无此字段的问题
2020/05/20 Python
python字典key不能是可以是啥类型
2020/08/04 Python
Python利用命名空间解析XML文档
2020/08/10 Python
英国时尚首饰品牌:Missoma
2020/06/29 全球购物
婚纱摄影师求职信
2014/03/07 职场文书
珍惜水资源建议书
2014/03/12 职场文书
与美同行演讲稿
2014/09/13 职场文书
国际贸易实务实训报告
2014/11/05 职场文书
负责培养人意见
2015/06/05 职场文书
python实现Thrift服务端的方法
2021/04/20 Python
golang生成并解析JSON
2022/04/14 Golang
MySQL事务的隔离级别详情
2022/07/15 MySQL