JavaScript 面向?qū)ο笕腴T精簡篇
更新時間：2009年03月21日 16:37:29 作者：
圍繞面向?qū)ο蟮膸状箨P(guān)鍵字：封裝 ，繼承 ，多態(tài) ，展開JavaScript面向?qū)ο?/div>
C.摻元類： 把一些常用通用性比較大的方法統(tǒng)一封裝在一個函數(shù)中，然后通過下面這個函數(shù)分派給要用到這些方法的類．還可以針對不同的類，選擇性的傳遞需要的方法。
<script type="text/javascript">
function agument(receveClass,giveClass){
if(arguments[2]){
var len = arguments.length;
for(i=2;i<len;i++){
receveClass.prototype[arguments[i]] = giveClass.prototype[arguments[i]];
}
}
else{
for(method in giveClass.prototype){
if(!receveClass.prototype[method]){
receveClass.prototype[method] = giveClass.prototype[method];
}
}
}
};
var Name = function(){};
Name.prototype ={
sayLike:function(){
alert("i like oldfish");
},
sayLove:function(){
alert("i love oldfish");
}
}
var Fish = function(){};
var ioldFish = new Fish();
agument(Fish,Name,"sayLove");
ioldFish.sayLove();
ioldFish.sayLike();
</script>
多態(tài) ：個人覺得這個比較抽象，很難言傳，所以下面就從重載和覆蓋兩個方面來簡單闡述一下。
重載 ：上面這個例子中agument函數(shù)初始帶了兩個參數(shù)，但是在后面的調(diào)用中，agument(Fish,Name,”sayLove”)同樣可以帶入任意多個參數(shù)，javascript的重載，是在函數(shù)中由用戶自己通過操作arguments這個屬性來實現(xiàn)的。
覆蓋 ：這個很簡單，就是子類中定義的方法如果與從超類中繼承過來的的方法同名，就覆蓋這個方法（這里并不是覆蓋超類中的方法，注意一下），這里就不累贅了！
最后重點著墨說一下this和執(zhí)行上下文 ，在前面舉的封裝例子中，this都是表示this所在的類的實例化對象本身，但是并不是千篇一律的，打個比方，通過HTML屬性定義的事件處理代碼，見如下代碼：
<script type="text/javascript">
var Name = function(name) {
this.name = name;
this.getName = function () {
alert(this.name);
}
};
var ioldFish = new Name("老魚"),
btn = document.getElementById('btn');
btn.onclick = ioldFish.getName;
//btn.onclick = function(){ioldFish.getName.call(ioldFish)};
</script>
上例中點了按鈕以后彈出框里并沒有顯示出實例對象的屬性，這是因為this的執(zhí)行上下文已經(jīng)改變了，他現(xiàn)在所在的上下文應(yīng)該是input這個 HTML標簽，但是該標簽又不存在getName這個屬性，所以自然無法輸出這個屬性的屬性值了！從這個例子我們不難看出：執(zhí)行上下文是在執(zhí)行時才確定的，它隨時可以變。
當然你可以去掉上面我注釋掉的那段代碼，通過call改變this的執(zhí)行上下文，從而獲取getName方法。apply方法同樣可以實現(xiàn)改變執(zhí)行上下文的功能，不過在prototype框架中發(fā)現(xiàn)了一個更為優(yōu)美的實現(xiàn)方法bind。看一下這個方法的實現(xiàn)吧，不得不感嘆先人的偉大……
Function.prototype.bind = function(obj) {
var method = this,
temp = function() {
return method.apply(obj, arguments);
};
}
相信如果能看明白的話，您已經(jīng)可以靠這些知識點，去寫一個簡單的腳本框架了，多多實踐，相信不久的將來就能高手進級了
C.摻元類： 把一些常用通用性比較大的方法統(tǒng)一封裝在一個函數(shù)中，然后通過下面這個函數(shù)分派給要用到這些方法的類．還可以針對不同的類，選擇性的傳遞需要的方法。
復(fù)制代碼 代碼如下:
<script type="text/javascript">
function agument(receveClass,giveClass){
if(arguments[2]){
var len = arguments.length;
for(i=2;i<len;i++){
receveClass.prototype[arguments[i]] = giveClass.prototype[arguments[i]];
}
}
else{
for(method in giveClass.prototype){
if(!receveClass.prototype[method]){
receveClass.prototype[method] = giveClass.prototype[method];
}
}
}
};
var Name = function(){};
Name.prototype ={
sayLike:function(){
alert("i like oldfish");
},
sayLove:function(){
alert("i love oldfish");
}
}
var Fish = function(){};
var ioldFish = new Fish();
agument(Fish,Name,"sayLove");
ioldFish.sayLove();
ioldFish.sayLike();
</script>
多態(tài) ：個人覺得這個比較抽象，很難言傳，所以下面就從重載和覆蓋兩個方面來簡單闡述一下。
重載 ：上面這個例子中agument函數(shù)初始帶了兩個參數(shù)，但是在后面的調(diào)用中，agument(Fish,Name,”sayLove”)同樣可以帶入任意多個參數(shù)，javascript的重載，是在函數(shù)中由用戶自己通過操作arguments這個屬性來實現(xiàn)的。
覆蓋 ：這個很簡單，就是子類中定義的方法如果與從超類中繼承過來的的方法同名，就覆蓋這個方法（這里并不是覆蓋超類中的方法，注意一下），這里就不累贅了！
最后重點著墨說一下this和執(zhí)行上下文 ，在前面舉的封裝例子中，this都是表示this所在的類的實例化對象本身，但是并不是千篇一律的，打個比方，通過HTML屬性定義的事件處理代碼，見如下代碼：
復(fù)制代碼 代碼如下:
<script type="text/javascript">
var Name = function(name) {
this.name = name;
this.getName = function () {
alert(this.name);
}
};
var ioldFish = new Name("老魚"),
btn = document.getElementById('btn');
btn.onclick = ioldFish.getName;
//btn.onclick = function(){ioldFish.getName.call(ioldFish)};
</script>
上例中點了按鈕以后彈出框里并沒有顯示出實例對象的屬性，這是因為this的執(zhí)行上下文已經(jīng)改變了，他現(xiàn)在所在的上下文應(yīng)該是input這個 HTML標簽，但是該標簽又不存在getName這個屬性，所以自然無法輸出這個屬性的屬性值了！從這個例子我們不難看出：執(zhí)行上下文是在執(zhí)行時才確定的，它隨時可以變。
當然你可以去掉上面我注釋掉的那段代碼，通過call改變this的執(zhí)行上下文，從而獲取getName方法。apply方法同樣可以實現(xiàn)改變執(zhí)行上下文的功能，不過在prototype框架中發(fā)現(xiàn)了一個更為優(yōu)美的實現(xiàn)方法bind。看一下這個方法的實現(xiàn)吧，不得不感嘆先人的偉大……
復(fù)制代碼 代碼如下:
Function.prototype.bind = function(obj) {
var method = this,
temp = function() {
return method.apply(obj, arguments);
};
}
相信如果能看明白的話，您已經(jīng)可以靠這些知識點，去寫一個簡單的腳本框架了，多多實踐，相信不久的將來就能高手進級了
相關(guān)文章
JavaScript為對象原型prototype添加屬性的兩種方式
為對象原型prototype添加屬性的的方法， 需要的朋友可以參考下。2010-08-08
js類中獲取外部函數(shù)名的方法與代碼...2007-09-09
在第一章中，我們使用構(gòu)造函數(shù)和原型的方式在JavaScript的世界中實現(xiàn)了類和繼承， 但是存在很多問題。這一章我們將會逐一分析這些問題，并給出解決方案。2009-07-07
JavaScript 面向?qū)ο缶幊蹋?） 基礎(chǔ)
自從有了Ajax這個概念，JavaScript作為Ajax的利器，其作用一路飆升。JavaScript最基本的使用，以及語法、瀏覽器對象等等東東在這里就不累贅了。把主要篇幅放在如何實現(xiàn)JavaScript的面向?qū)ο缶幊谭矫妗?/div> 2010-05-05
JavaScript 類的定義和引用 JavaScript高級培訓(xùn) 自定義對象
在Java語言中，我們可以定義自己的類，并根據(jù)這些類創(chuàng)建對象來使用，在Javascript中，我們也可以定義自己的類，例如定義User類、Hashtable類等等。2010-04-04
利用原型繼承的關(guān)鍵有兩步操作，需要的朋友可以參考下。2009-12-12
數(shù)據(jù)類型,基本數(shù)據(jù)類型基本數(shù)據(jù)類型是JS語言最底層的實現(xiàn)。2008-04-04
javascript幾乎成了如今web開發(fā)人員必學(xué)必會的一門語言，但很多人卻只停在了一些表單驗證等基礎(chǔ)操作層面上，在面向?qū)ο笳Z言大行其道的當下，我們需要去學(xué)習(xí)javascript的面向?qū)ο蟮闹R，以便更好的掌握javascript、為深入理解各種腳本框架打好基礎(chǔ)。2009-09-09
Javascript 面向?qū)ο螅ǘ┓庋b代碼，需要的朋友可以參考下2012-05-05