继承可以达到代码的复用,利于维护和扩展。

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 实现多继承的更多相关文章

  1. [原]sencha touch之表单(login demo)

    现在来说说sencha touch中的表单,举个简单的login的例子,相关的说明我都放在了注释中,看下面代码 Ext.application({ id:'itKingApp', launch:fun ...

  2. sencha touch 类的使用

    sencha touch 有一套自己的类机制,可以以面向对象的方式去写代码,封装业务逻辑,sencha touch 的组件.插件.api等都建立在这一套类机制的上面 在实际开发中,我们需要遵循这一套机 ...

  3. sencha touch 扩展篇之使用sass自定义主题样式 (上)使用官方的api修改主题样式

    大家知道,sencha touch是通过我们写的js代码来动态渲染单页面生成一个个div+css的html页面来模拟app应用,那么既然是div+css结构的,我们就可以通过修改css样式来自定义我们 ...

  4. sencha touch 入门系列 (九)sencha touch 视图组件简介

    对于一个普通用户来说,你的项目就是一组简单的视图集合,用户直接通过跟视图进行交互来操作你的应用,对于一个开发人员来说,视图是一个项目的入口,虽然大部分时候最有价值的部分是在model层和control ...

  5. sencha touch 入门系列 (七)sencha touch 类系统讲解(上)

    在mvc结构的基础上,sencha touch又使用了sencha公司为extjs4开发出来的类系统,在面向对象的编程语言中,类是对对象的定义,它描述了对象所包含的大量属性和方法. 跟面向对象语言类似 ...

  6. 解读sencha touch移动框架的核心架构(一)

    sencha的前身就是Extjs了,sencha 框架是世界上第一个基于HTML5的Mobile App框架 那么何谓框架,传统软件工程对于库和框架的区分主要着眼于对应用运行流程的控制权,框架提供架构 ...

  7. sencha touch api 使用指南

    本文主要讲解如何使用sencha touch的api以及如何查看api中官方示例源码 前期准备 1.sdk 下载地址:http://www.sencha.com/products/touch/down ...

  8. 【翻译】在Ext JS和Sencha Touch中创建自己定义布局

    原文:Creating Custom Layouts in Ext JS and Sencha Touch 布局系统是Sencha框架中最强大和最独特的一部分.布局会处理应用程序中每个组件的大小和位置 ...

  9. 选择移动web开发框架研究——有mui、frozenui以及Sencha Touch等

    纯粹的总结一下移动web开发框架,移动 web开发框架有jQuery Mobile .Sencha Touch等等,他们都来源于web开发,是成熟的框架,jQuery Mobile出自于jQuery家 ...

随机推荐

  1. 设计模式9---装饰模式(Decorator Pattern)

    装饰模式又名包装(Wrapper)模式.装饰模式以对客户端透明的方式扩展对象的功能,是继承关系的一个替代方案. 装饰模式的结构 装饰模式以对客户透明的方式动态地给一个对象附加上一些责任.换言之,客户端 ...

  2. solr&lucene3.6.0源码解析(一)

      本文作为系列的第一篇,主要描述的是solr3.6.0开发环境的搭建   首先我们需要从官方网站下载solr的相关文件,下载地址为http://archive.apache.org/dist/luc ...

  3. Hadoop 文件命令

    * 文件操作 * 查看目录文件 * $ hadoop dfs -ls /user/cl * * 创建文件目录 * $ hadoop dfs -mkdir /user/cl/temp * * 删除文件  ...

  4. robotframework+jenkins分布式执行自动化测试用例

    http://blog.sina.com.cn/s/blog_53f023270101sc3w.html http://www.cnblogs.com/2test/p/5336842.html

  5. android hook getdeceiveid

    很多手机软件使用了手机绑定.QQ,微信等.如果使用了不同的设备,则需要验证码. 要用一台手机来模拟与另一台手机一样环境,估计hook 系统的相关函数可以实现. 想着应该有现成的软件的,例如 smart ...

  6. mysql用户增删改

    MySql中添加用户,新建数据库,用户授权,删除用户,修改密码(注意每行后边都跟个;表示一个命令语句结束): 1.新建用户 1.1 登录MYSQL: @>mysql -u root -p @&g ...

  7. 重新理解javascript回调函数

    把函数作为参数传入到另一个函数中.这个函数就是所谓的回调函数 经常遇到这样一种情况,某个项目的A层和B层是由不同的人员协同完成.A层负责功能funA,B层负责funcB.当B层要用到某个模块的数据,于 ...

  8. 初学python - 使用pip安装扩展库

    cmd pip install -i https://pypi.tuna.tsinghua.edu.cn/simple PyMySQL - 使用清华镜像下载PyMySQL pip python包管理工 ...

  9. 爬虫开发14.scrapy框架之分布式操作

    分布式爬虫 一.redis简单回顾 1.启动redis: mac/linux:   redis-server redis.conf windows: redis-server.exe redis-wi ...

  10. Major compaction时的scan操作

    版权声明:本文为博主原创文章.未经博主同意不得转载. https://blog.csdn.net/u014393917/article/details/24419355 Major compactio ...