Extjs中使用extend(js繼承) 的代碼
更新時間:2012年03月15日 00:28:05 作者:
Extjs中使用extend(js繼承) 的代碼,抄<深入淺出Extjs>書
注:抄<深入淺出Extjs>書
傳統(tǒng)的js實(shí)現(xiàn)繼承操作為:
一:定義一個父類
var BaseClass = function(){
//.....
};
BaseClass.prototype.someMethod = function(){
//.....
};
BaseClass.prototype.overridenMethod = function(){
//....
}
為BaseClass定義兩個函數(shù)someMethod 和overridenMethod ,,然后定義一個subClass子類,可以直接從BaseClass中繼承所有的屬性和函數(shù),
var subClass = function(){
BaseClass.call(this);
};
subClass.prototype = new BaseClass();
subClass.prototype.newMethod = function(){
//...
};
subClass.prototype.overridenMethod = function(){
//...
}
在上面的代碼中,subClass的構(gòu)造函數(shù)首先調(diào)用BaseClass的構(gòu)造函數(shù)初始化數(shù)據(jù),然后通過subClass.prototype = new BaseClass();這條語句讓subClass類獲得BaseClass中的所有屬性和函數(shù)。這樣就實(shí)現(xiàn)了繼承。在此之后我們就可以操作subClass的prototype,為子類添加新的函數(shù)或者覆寫父類的同名函數(shù)。
在EXT中使用Ext.extend()函數(shù)實(shí)現(xiàn)繼承功能的方法:
var subClass = function(){
subClass.superclass.costructor.call(this);
};
Ext.extend(subClass, BaseClass,{
newMethod: function(){
//...
},
overridenMethod : function(){
//....
}
});
在Ext.extend()函數(shù)通過 subClass.superclass.costructor.call(this);就可以直接調(diào)用父類的構(gòu)造函數(shù)。這個函數(shù)的第一個參數(shù)總是this, 以確保父類的構(gòu)造函數(shù)在子類的作用域里工作。
如果父類的構(gòu)造函數(shù)需要傳入?yún)?shù),我們也就可以將所需要的參數(shù)直接傳給它,如:
subClass.superclass.costructor.call(this, config);
這樣我們就得到了一個繼承了父類的所有屬性和函數(shù)的子類。
傳統(tǒng)的js實(shí)現(xiàn)繼承操作為:
一:定義一個父類
復(fù)制代碼 代碼如下:
var BaseClass = function(){
//.....
};
BaseClass.prototype.someMethod = function(){
//.....
};
BaseClass.prototype.overridenMethod = function(){
//....
}
為BaseClass定義兩個函數(shù)someMethod 和overridenMethod ,,然后定義一個subClass子類,可以直接從BaseClass中繼承所有的屬性和函數(shù),
復(fù)制代碼 代碼如下:
var subClass = function(){
BaseClass.call(this);
};
subClass.prototype = new BaseClass();
subClass.prototype.newMethod = function(){
//...
};
subClass.prototype.overridenMethod = function(){
//...
}
在上面的代碼中,subClass的構(gòu)造函數(shù)首先調(diào)用BaseClass的構(gòu)造函數(shù)初始化數(shù)據(jù),然后通過subClass.prototype = new BaseClass();這條語句讓subClass類獲得BaseClass中的所有屬性和函數(shù)。這樣就實(shí)現(xiàn)了繼承。在此之后我們就可以操作subClass的prototype,為子類添加新的函數(shù)或者覆寫父類的同名函數(shù)。
在EXT中使用Ext.extend()函數(shù)實(shí)現(xiàn)繼承功能的方法:
復(fù)制代碼 代碼如下:
var subClass = function(){
subClass.superclass.costructor.call(this);
};
Ext.extend(subClass, BaseClass,{
newMethod: function(){
//...
},
overridenMethod : function(){
//....
}
});
在Ext.extend()函數(shù)通過 subClass.superclass.costructor.call(this);就可以直接調(diào)用父類的構(gòu)造函數(shù)。這個函數(shù)的第一個參數(shù)總是this, 以確保父類的構(gòu)造函數(shù)在子類的作用域里工作。
如果父類的構(gòu)造函數(shù)需要傳入?yún)?shù),我們也就可以將所需要的參數(shù)直接傳給它,如:
subClass.superclass.costructor.call(this, config);
這樣我們就得到了一個繼承了父類的所有屬性和函數(shù)的子類。
相關(guān)文章
extjs 學(xué)習(xí)筆記(三) 最基本的grid
extjs的一個亮點(diǎn)就是提供了豐富的UI,使得沒有藝術(shù)細(xì)胞的程序員也能做出絢麗的界面。把所有的UI集中到一起,有好處也有壞處,好處是有了統(tǒng)一的風(fēng)格和接口,壞處是js文件過于龐大,使用extjs的最小集合也超過了500k,所以在有些項(xiàng)目中并不適用。2009-10-10解決Extjs 4 Panel作為Window組件的子組件時出現(xiàn)雙重邊框問題
Extjs的Panel和Window等組件在默認(rèn)情況下是帶邊框的,通常情況下,單獨(dú)使用沒有什么關(guān)系,但是將Panel作為Window組件的子組件時就會出現(xiàn)雙重邊框的現(xiàn)象于是想辦法將兩重邊框去掉,變成單邊框,感興趣的朋友可以了解下2013-01-01Ext JS 4實(shí)現(xiàn)帶week(星期)的日期選擇控件(實(shí)戰(zhàn)二)
Javascript 有提供Date 對象用于處理時間。但是Date 并沒有提供獲取星期的方法,jquery 的擴(kuò)展組件 等有直接提供這樣的一些現(xiàn)成包,感興趣的朋友可以了解下2013-08-08