Extjs4 Web Application Development Cookbook学习笔记三

原创翻译,欢迎纠错,转载请注明出处

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

    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'


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

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

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...');
    }
});

你可能感兴趣的:(JavaScript,类,extjs4,minixs,引入类)