Extjs4 Web Application Development Cookbook学习笔记三

8 篇文章 0 订阅
7 篇文章 0 订阅
[color=red][u][b]原创翻译,欢迎纠错,转载请注明出处[/b][/u][/color]

[b]3.在当前类中引入其他类的属性和方法[/b]

Mixins是指将其他类得属性和方法引入到本类中,为我们提供了另外一种形式的继承。
通过mixins机制我们可以将功能单一的类进行组合使用,减少了重复代码,也不必去直接继承。
Mixins的一个例子是 Ext.form.Labelable类,他将label类引入Labelable类中。
下面以一个简单的例子说明mixin是如何使用的:
(1)创建一个类HasCamera,他有一个方法是takePhoto:


Ext.define('HasCamera',{
takePhoto : function(){
alert("qiezi");
}
}
);

(2)创建一个框架类,将HasCamera引入其中


Ext.define('Cookbook.Smartphone',{
minixs :{
camera : 'HasCamera'
},
useCamera: function(){//这里即可使用HasCamera中的方法takePhoto
this.takePhoto();
}
});


(3)使用实例

var smartphone = Ext.create('Cookbook.Smartphone');
smartphone.useCamera(); // alerts 'qiezi'


[b]工作原理[/b]
通过使用minixs可以将多个class集成为一个功能齐全的class,(这里充分体现了组合优于继承的思想)。这意味着所有被引入的类的属性和方法通过此类得实例均可访问。(可以理解为引入后和本类得方法属性使用起来没有任何区别)

[b]More[/b]
传统情况下我们继承了一个类后,类得某个方法可能需要重写,这里的重写机制与继承一样。但是有一点需要注意,在重写后调用被引入类的同名方法时需要通过访问原型中的方法调用。
例如我们扩展上例,加入聚焦方法,在拍照前首先要聚焦。


Ext.define('Cookbook.Smartphone', {
mixins: {
camera: 'HasCamera'
},
useCamera: function(){
this.takePhoto();
},
takePhoto: function(){
this.focus();
//这里直接调用this.takePhoto会出现死循环,需通过访问原型中的方法调用
this.mixins.camera.takePhoto.call(this);
},
focus: function(){
alert('Focusing...');
}
});
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值