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 相关文章推荐
详细介绍8款超实用JavaScript框架
Oct 25 Javascript
验证控件与Button的OnClientClick事件详细解析
Dec 04 Javascript
告诉你什么是javascript的回调函数
Sep 04 Javascript
node.js中的console.timeEnd方法使用说明
Dec 09 Javascript
JQuery zClip插件实现复制页面内容到剪贴板
Nov 02 Javascript
element ui里dialog关闭后清除验证条件方法
Feb 26 Javascript
vue项目中vue-i18n和element-ui国际化开发实现过程
Apr 25 Javascript
jQuery+Datatables实现表格批量删除功能【推荐】
Oct 24 jQuery
详解几十行代码实现一个vue的状态管理
Jan 28 Javascript
vue前端框架—Mint UI详解(更适用于移动端)
Apr 30 Javascript
jQuery实现弹出层效果
Dec 10 jQuery
微信小程序自定义yPicker组件实现省市区三级联动功能
Oct 29 Javascript
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实现图片添加水印功能
2014/02/13 PHP
php把数据表导出为Excel表的最简单、最快的方法(不用插件)
2014/05/10 PHP
PHP+jQuery 注册模块的改进(三):更新到Smarty3.1
2014/10/14 PHP
几个实用的PHP内置函数使用指南
2014/11/27 PHP
JavaScript 拖拉缩放效果
2008/12/10 Javascript
JS控制一个DIV层在指定时间内消失的方法
2014/02/17 Javascript
jQuery实现级联菜单效果(仿淘宝首页菜单动画)
2014/04/10 Javascript
JavaScript声明变量时为什么要加var关键字
2014/09/29 Javascript
实现无刷新联动例子汇总
2015/05/20 Javascript
JavaScript中的bold()方法使用详解
2015/06/08 Javascript
js去除浏览器默认底图的方法
2015/06/08 Javascript
JavaScript实现数组随机排序的方法
2015/06/26 Javascript
除Console.log()外更多的Javascript调试命令
2018/01/24 Javascript
Nuxt升级2.0.0时出现的问题(小结)
2018/10/08 Javascript
Vue ​v-model相关知识总结
2021/01/28 Vue.js
[03:44]2015国际邀请赛选手档案—Cloud9.NoTail
2015/07/28 DOTA
Python enumerate遍历数组示例应用
2008/09/06 Python
python通过装饰器检查函数参数数据类型的方法
2015/03/13 Python
python自定义类并使用的方法
2015/05/07 Python
Python检测生僻字的实现方法
2016/10/23 Python
Python编程二分法实现冒泡算法+快速排序代码示例
2018/01/15 Python
python实现AES加密和解密
2019/03/27 Python
python实现列表中最大最小值输出的示例
2019/07/09 Python
基于Python实现ComicReaper漫画自动爬取脚本过程解析
2019/11/11 Python
python 输出列表元素实例(以空格/逗号为分隔符)
2019/12/25 Python
Django路由层URLconf作用及原理解析
2020/09/24 Python
Python descriptor(描述符)的实现
2020/11/15 Python
Europcar英国:英国汽车和货车租赁
2017/01/21 全球购物
Sisley法国希思黎美国官方网站:享誉全球的奢华植物美容品牌
2020/06/27 全球购物
事业单位请假制度
2014/01/13 职场文书
研究生毕业鉴定
2014/01/29 职场文书
公安纪律作风整顿剖析材料
2014/10/10 职场文书
晋江市委常委班子四风问题整改工作方案
2014/10/26 职场文书
参观监狱警示教育心得体会
2016/01/15 职场文书
pytorch中F.avg_pool1d()和F.avg_pool2d()的使用操作
2021/05/22 Python
python turtle绘图命令及案例
2021/11/23 Python