extjs基础一

一、ExtJs是怎么对原始javascript对象进行扩展的，类似于下面

Object.prototype.get = function(key,defV){
   if(this[key]){
    return this[key];
   }else{
    if(defV){
     return defV;
    }
   }
  }

 

二、javascript中类的声明

function user(){
 //相当于java中的public变量
 this.name='youyang';
 this.age = 25;
 //相当于private变量
 var email = "[e-mail]";
 this.getEmail = function(){
  return email;
 }
}

 

三、exjts中定义类

 Ext.define("MyWin",{
   extend:"Ext.window.Window",
   width:400,
   height:300,
   title:"哈哈",
   newTitle:"new title",
   setNewTitle:function(){
    this.title = this.newTitle;
   },
   initComponent : function(){
    alert(arguments.length);
    alert(typeof this);
    for(var i=0;i<arguments.length;i++){
     alert(arguments[i]);
    }
    this.setNewTitle();
    this.callParent(arguments);
   }
  });

 

 

 

其中initComponent 表示构造函数，里面this.callParent(arguments);表示调用父类的构造方法。

extend表示继承。

 

四、多层继续

Ext.define("say",{
   canSay:function(){
    alert("say");
   }
  });
  
  Ext.define("fly",{
   canFly:function(){
    alert("fly");
   }
  });
  
  Ext.define("user",{
   //实现多继承
   mixins:{
    s:'say',
    f:fly
   }
  })
  
  var user = Ext.create("user",{});
  user.canFly();
  user.canSay();

 

五、实例化一个类

var wind = Ext.create("ux.MyWin",{
    title:"my win",
    price:600,
    required:["ux.MyWin"]
   });
   wind.show();
   alert(wind.getPrice());

 

其中required:["ux.MyWin"]表示创建该对象所依赖的类。

 

六、extjs中的动态加载

1、首先设置Ext.Loader

Ext.Loader.setConfig({
  enabled:true,
  paths:{
   myApp:"code/ux"
  }
 });

设置动态加载的类路径为code包下的ux包下的所有类。

2、

Ext.get("myb").on("click",function(){
   
   var wind = Ext.create("ux.MyWin",{
    title:"my win",
    price:600,
    required:["ux.MyWin"]
   });
   wind.show();
   alert(wind.getPrice());
  });

当使用到ux.MyWin时，才到paths下面加载ux.MyWin。

 

 七、取别名

var o = {
   say:function(){
    alert("aaaa");
   }
  };
  
  //取了一个别名
  var s = Ext.Function.alias(o,"say");
  
  s();