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 对象的解释
Nov 24 Javascript
JS执行删除前的判断代码
Feb 18 Javascript
超级好用的jQuery圆角插件 Corner速成
Aug 31 Javascript
jQuery中ajax的load()方法用法实例
Dec 26 Javascript
JavaScript实现列表分页功能特效
May 15 Javascript
JavaScript访问字符串中单个字符的两种方法
Jul 03 Javascript
AngularJS 所有版本下载地址
Sep 14 Javascript
JS类的定义与使用方法深入探索
Nov 26 Javascript
VueJs与ReactJS和AngularJS的异同点
Dec 12 Javascript
Vue.js 实现微信公众号菜单编辑器功能(二)
May 08 Javascript
微信小程序从注册账号到上架(图文详解)
Jul 17 Javascript
JavaScript单线程和任务队列原理解析
Feb 04 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中unlink()、mkdir()、rmdir()等方法的使用介绍
2012/12/21 PHP
php Hex RGB颜色值互换的使用
2013/05/10 PHP
教你php如何实现验证码
2016/01/20 PHP
PHP实现获取并生成数据库字典的方法
2016/05/04 PHP
PHP中in_array的隐式转换的解决方法
2018/03/06 PHP
js中将字符串转换成json的三种方式
2011/01/12 Javascript
extjs 3.31 TreeGrid实现静态页面加载json到TreeGrid里面
2013/04/02 Javascript
简介JavaScript中setUTCSeconds()方法的使用
2015/06/12 Javascript
jquery实现鼠标滑过小图查看大图的方法
2015/07/20 Javascript
jQuery实现默认是闭合的FAQ展开效果菜单
2015/09/14 Javascript
jQuery解析Json实例详解
2015/11/24 Javascript
Bootstrap基本样式学习笔记之表单(3)
2016/12/07 Javascript
Vue.js双向绑定操作技巧(初级入门)
2016/12/27 Javascript
浅谈webpack编译vue项目生成的代码探索
2017/12/11 Javascript
手写简单的jQuery雪花飘落效果实例
2018/04/22 jQuery
Vue 开发音乐播放器之歌手页右侧快速入口功能
2018/08/08 Javascript
谈谈React中的Render Props模式
2018/12/06 Javascript
angular中如何绑定iframe中src的方法
2019/02/01 Javascript
在Python中操作文件之read()方法的使用教程
2015/05/24 Python
python实现文本去重且不打乱原本顺序
2016/01/26 Python
python自动截取需要区域,进行图像识别的方法
2018/05/17 Python
Python读取指定日期邮件的实例
2019/02/01 Python
python使用PyQt5的简单方法
2019/02/27 Python
使用python进行广告点击率的预测的实现
2019/07/04 Python
pytorch自定义二值化网络层方式
2020/01/07 Python
Python在终端通过pip安装好包以后在Pycharm中依然无法使用的问题(三种解决方案)
2020/03/10 Python
Python3.9.0 a1安装pygame出错解决全过程(小结)
2021/02/02 Python
介绍一下Make? 为什么使用make
2013/12/08 面试题
创业大赛策划书
2014/03/01 职场文书
《跟踪台风的卫星》教学反思
2014/04/10 职场文书
小学生运动会通讯稿
2014/09/23 职场文书
“六查”、“三学”、“三干”查摆问题整改措施
2014/09/27 职场文书
Nginx 过滤静态资源文件的访问日志的实现
2021/03/31 Servers
canvas绘制折线路径动画实现
2021/05/12 Javascript
聊聊redis-dump工具安装问题
2022/01/18 Redis
python和Appium的移动端多设备自动化测试框架
2022/04/26 Python