sencha touch extend 单继承 和 mixins 实现多继承
继承可以达到代码的复用,利于维护和扩展。
sencha touch 中可以通过 extend 实现单继承,通过 mixins 实现多继承。
mixins 也很像实现接口,不过这些接口的方法已经实现了,不用自己写了。当然也可以复写基类的方法。
extend 继承
Ext.define('Person', {
constructor : function(name, age) {
this.name = name;
this.age = age;
},
walk : function() {
console.log('Person walk');
},
sleep : function() {
console.log('Person sleep');
}
});
Ext.define('Stu', {
extend : 'Person',
constructor : function(name, age, city) {
this.city = city;
// 调用父类构造器
// 因为底层调用的是 superMethod.apply , 所以参数以数组的形式传递
this.callParent([ name, age ]);
},
walk : function() {
console.log('Stu walk');
// 调用父类方法
this.callParent();
}
});
var s = Ext.create('Stu', 'leslie', 25, 'beijing');
console.log(s);
console.log(s.superclass);
console.log(s.name);
console.log(s.age);
console.log(s.city);
s.walk();
// s.superclass.walk();
s.sleep();
// Log 如下
// [Log] Object
// [Log] Object
// [Log] leslie
// [Log] 25
// [Log] beijing
// [Log] Stu walk
// [Log] Person walk
// [Log] Person sleep
2 mixins 多继承
Ext.define('Person', {
constructor : function(name, age) {
this.name = name;
this.age = age;
},
walk : function() {
console.log('Person walk');
},
sleep : function() {
console.log('Person sleep');
}
});
Ext.define('CanWalk', {
walk : function() {
console.log('can walk');
}
});
Ext.define('CanSing', {
sing : function() {
console.log('can sing');
}
});
Ext.define('Stu', {
extend : 'Person',
// 混入 CanWalk CanSing
mixins : [ 'CanWalk', 'CanSing' ],
// 也可为混入的类重新指定一个 key
// 默认为类名
// 这样当类名很长时:如 Enway.Leslie.CanWalk
// 不用这样引用 this.mixins['Enway.Leslie.CanWalk']
// 而是直接通过 this.mixins.canWalk 引用
// mixins : {
// canWalk : 'Enway.Leslie.CanWalk',
// canSing : 'Enway.Leslie.CanSing'
// },
constructor : function(name, age, city) {
this.city = city;
// 调用父类构造器
// 因为底层调用的是 superMethod.apply , 所以参数以数组的形式传递
this.callParent([ name, age ]);
},
walk : function() {
console.log('Stu walk');
// 调用父类方法
// this.callParent();
// 调用 CanWalk 的 walk 方法
this.mixins.CanWalk.walk();
// 调用 CanSing 的 sing 方法
this.mixins.CanSing.sing();
}
});
var s = Ext.create('Stu', 'leslie', 25, 'beijing');
console.log(s);
console.log(s.superclass);
console.log(s.name);
console.log(s.age);
console.log(s.city);
s.walk();
// s.superclass.walk();
s.sleep();
// Log 如下
// [Log] Object
// [Log] Object
// [Log] leslie
// [Log] 25
// [Log] beijing
// [Log] Stu walk
// [Log] can walk
// [Log] can sing
// [Log] Person sleep
sencha touch extend 单继承 和 mixins 实现多继承的更多相关文章
- [原]sencha touch之表单(login demo)
现在来说说sencha touch中的表单,举个简单的login的例子,相关的说明我都放在了注释中,看下面代码 Ext.application({ id:'itKingApp', launch:fun ...
- sencha touch 类的使用
sencha touch 有一套自己的类机制,可以以面向对象的方式去写代码,封装业务逻辑,sencha touch 的组件.插件.api等都建立在这一套类机制的上面 在实际开发中,我们需要遵循这一套机 ...
- sencha touch 扩展篇之使用sass自定义主题样式 (上)使用官方的api修改主题样式
大家知道,sencha touch是通过我们写的js代码来动态渲染单页面生成一个个div+css的html页面来模拟app应用,那么既然是div+css结构的,我们就可以通过修改css样式来自定义我们 ...
- sencha touch 入门系列 (九)sencha touch 视图组件简介
对于一个普通用户来说,你的项目就是一组简单的视图集合,用户直接通过跟视图进行交互来操作你的应用,对于一个开发人员来说,视图是一个项目的入口,虽然大部分时候最有价值的部分是在model层和control ...
- sencha touch 入门系列 (七)sencha touch 类系统讲解(上)
在mvc结构的基础上,sencha touch又使用了sencha公司为extjs4开发出来的类系统,在面向对象的编程语言中,类是对对象的定义,它描述了对象所包含的大量属性和方法. 跟面向对象语言类似 ...
- 解读sencha touch移动框架的核心架构(一)
sencha的前身就是Extjs了,sencha 框架是世界上第一个基于HTML5的Mobile App框架 那么何谓框架,传统软件工程对于库和框架的区分主要着眼于对应用运行流程的控制权,框架提供架构 ...
- sencha touch api 使用指南
本文主要讲解如何使用sencha touch的api以及如何查看api中官方示例源码 前期准备 1.sdk 下载地址:http://www.sencha.com/products/touch/down ...
- 【翻译】在Ext JS和Sencha Touch中创建自己定义布局
原文:Creating Custom Layouts in Ext JS and Sencha Touch 布局系统是Sencha框架中最强大和最独特的一部分.布局会处理应用程序中每个组件的大小和位置 ...
- 选择移动web开发框架研究——有mui、frozenui以及Sencha Touch等
纯粹的总结一下移动web开发框架,移动 web开发框架有jQuery Mobile .Sencha Touch等等,他们都来源于web开发,是成熟的框架,jQuery Mobile出自于jQuery家 ...
随机推荐
- HBASE学习d端口master:16010(java操作hbase)https://www.cnblogs.com/junrong624/p/7323483.html
HBase提示已创建表,但是list查询时,却显示表不存在. https://blog.csdn.net/liu16659/article/details/80216085 下载网址 http://a ...
- 20、Semantic-UI之数据验证
20.1 实现数据验证 在很多前端框架中都提供了数据验证的操作,比如jQuery的验证框架等,但是jQuery的验证框架js文件太多:在使用Semantic-UI框架的时候只需要导入semanti ...
- 我眼中的SAML (Security Assertion Markup Language)
提到SAML (Security Assertion Markup Language), 很多人都会联想到单点登录SSO.那么Saml到底是什么,它跟sso到底有什么联系?这里给大家分享一下我在读完了 ...
- Java 连接、操控数据库总结(JDBC)
看到数据库连接不由得想起了大一末参加团队考核时的悲催经历~~,还记得当初傻傻地按照书本的代码打到 Eclipse 上,然后一运行就各种报错...报错后还傻傻地和书本的代码一遍又一遍地进行核对,发现无误 ...
- [Cocos2d-x for WP8学习笔记] 一些基本概念,建立自己的启动界面
流程控制:场景是相对不变的游戏元素集合,游戏在场景间的切换就是流程控制. 场景.层和精灵:它们是不同层次的游戏元素.通常,场景包含层,层包含精灵,场景与层是其他游戏元素的容器,而精灵是展示给玩家的图形 ...
- 读取二元组列表,打印目录的层级结构-----C++算法实现
要求是--某个文件中存储了一个最多3层的层级结构,其中每个元素都是一个自然数,它的存储方法是一个二元组的列表,每个二元组的形式为:(元素,父元素).现在希望能够通过读取该二元组列表,打印出目录的层级结 ...
- 二十六、Nodejs 操作 MongoDb 数据库
一. 在 Nodejs 中使用 Mongodb 前面的课程我们讲了用命令操作 MongoDB,这里我们看下如何用 nodejs 来操作数据库需要引包: npm install mongodb --sa ...
- 在linux 创建网络会话和绑定两块网卡
1. 如果我们在公司网络中要手动指定网络的IP地址,当我们回到家里则是使用DHCP(动态主机配置协议)自动分配IP地址.这就有点麻烦了,因为要频繁的修改IP地址,所以接下来我们来创建网络会话----- ...
- 吴裕雄 python 机器学习——高斯贝叶斯分类器GaussianNB
import matplotlib.pyplot as plt from sklearn import datasets,naive_bayes from sklearn.model_selectio ...
- [bzoj4445] [SCOI2015]小凸想跑步 (半平面交)
题意:凸包上一个点\(p\),使得\(p\)和点\(0,1\)组成的三角形面积最小 用叉积来求: \(p,i,i+1\)组成的三角形面积为: (\(\times\)为叉积) \((p_p-i)\tim ...