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 相关文章推荐
用 JavaScript 迁移目录
Dec 18 Javascript
Javascript之旅 对象的原型链之由来
Aug 25 Javascript
5分钟理解JavaScript中this用法分享
Nov 09 Javascript
PHP 数组current和next用法分享
Mar 05 Javascript
JS动态修改iframe高度和宽度的方法
Apr 01 Javascript
node前端开发模板引擎Jade的入门
May 11 Javascript
vue2.0学习之axios的封装与vuex介绍
May 28 Javascript
vue项目实现表单登录页保存账号和密码到cookie功能
Aug 31 Javascript
Vue.js的动态组件模板的实现
Nov 26 Javascript
详解vue2.0 资源文件assets和static的区别
Nov 27 Javascript
Vue快速实现通用表单验证的示例代码
Jan 09 Javascript
Vue-CLI 3 scp2自动部署项目至服务器的方法
Jul 24 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
Adodb的十个实例(清晰版)
2006/12/31 PHP
如何判断php数组的维度
2013/06/10 PHP
PHP会话控制:Session与Cookie详解
2014/09/27 PHP
浅析php中array_map和array_walk的使用对比
2016/11/20 PHP
Js表格万条数据瞬间加载实现代码
2014/02/20 Javascript
node.js开发中使用Node Supervisor实现监测文件修改并自动重启应用
2014/11/04 Javascript
jquery实现简单的全选和反选功能
2016/01/02 Javascript
javascript匀速动画和缓冲动画详解
2016/10/20 Javascript
基于Phantomjs生成PDF的实现方法
2016/11/07 Javascript
详解AngularJS验证、过滤器、指令
2017/01/04 Javascript
深入理解Node中的buffer模块
2017/06/03 Javascript
Angular模板表单校验方法详解
2017/08/11 Javascript
详解angularJS+Ionic移动端图片上传的解决办法
2017/09/13 Javascript
webpack4 升级迁移的实现
2018/09/12 Javascript
如何在JavaScript中优雅的提取循环内数据详解
2019/03/04 Javascript
python检测某个变量是否有定义的方法
2015/05/20 Python
在Django中使用Sitemap的方法讲解
2015/07/22 Python
Python连接DB2数据库
2016/08/27 Python
ubuntu系统下 python链接mysql数据库的方法
2017/01/09 Python
使用python爬取B站千万级数据
2018/06/08 Python
详解Python 协程的详细用法使用和例子
2018/06/15 Python
python多进程控制学习小结
2018/10/31 Python
pygame游戏之旅 添加碰撞效果的方法
2018/11/20 Python
Python 堆叠柱状图绘制方法
2019/07/29 Python
python读写csv文件并增加行列的实例代码
2019/08/01 Python
Selenium及python实现滚动操作多种方法
2020/07/21 Python
Magee 1866官网:Donegal粗花呢外套和大衣专家
2019/11/01 全球购物
服务中心夜班服务员岗位职责
2013/11/27 职场文书
写给学生的新学期寄语
2014/01/18 职场文书
物业品质提升方案
2014/06/08 职场文书
农业生产宣传标语
2014/10/08 职场文书
经理岗位职责
2015/02/02 职场文书
入党培养人考察意见
2015/06/08 职场文书
感恩教师主题班会
2015/08/12 职场文书
2016年优秀共产党员先进事迹材料
2016/02/29 职场文书
浅谈node.js中间件有哪些类型
2021/04/29 Javascript