日韩黑丝制服一区视频播放|日韩欧美人妻丝袜视频在线观看|九九影院一级蜜桃|亚洲中文在线导航|青草草视频在线观看|婷婷五月色伊人网站|日本一区二区在线|国产AV一二三四区毛片|正在播放久草视频|亚洲色图精品一区

分享

javascript重構(gòu)小結(jié)

 青格兒 2015-03-28

首先先來學(xué)習(xí)一下js 的幾種繼承方法:

1、原型鏈繼承:

Js代碼  收藏代碼
  1. var Base = function()  
  2. {  
  3.     this.level = 1;  
  4.     this.name = "base";  
  5.     this.toString = function(){  
  6.         return "base";  
  7.     };  
  8. };  
  9. Base.CONSTANT = "constant";  
  10.   
  11. var Sub = function()  
  12. {  
  13. };  
  14. Sub.prototype = new Base();  
  15. Sub.prototype.name = "sub";  

 

優(yōu)點(diǎn):從instanceof關(guān)鍵字來看,實(shí)例既是父類的實(shí)例,又是子類的實(shí)例,看起來似乎是最純粹的繼承。

缺點(diǎn):子類區(qū)別于父類的屬性和方法,必須在Sub.prototype = new Base();這樣的語句之后分別執(zhí)行,無法被包裝到Sub這個(gè)構(gòu)造器里面去。例如:Sub.prototype.name = "sub";無法實(shí)現(xiàn)多重繼承。

 

 

2、構(gòu)造繼承:

Js代碼  收藏代碼
  1. var Base = function()  
  2. {  
  3.     this.level = 1;  
  4.     this.name = "base";  
  5.     this.toString = function(){  
  6.         return "base";  
  7.     };  
  8. };  
  9. Base.CONSTANT = "constant";  
  10.   
  11. var Sub = function()  
  12. {  
  13.     Base.call(this);  
  14.     this.name = "sub";  
  15. };  

優(yōu)點(diǎn):可以實(shí)現(xiàn)多重繼承,可以把子類特有的屬性設(shè)置放在構(gòu)造器內(nèi)部。

缺點(diǎn):使用instanceof發(fā)現(xiàn),對(duì)象不是父類的實(shí)例。

 

 

3、實(shí)例繼承:

Js代碼  收藏代碼
  1. var Base = function()  
  2. {  
  3.     this.level = 1;  
  4.     this.name = "base";  
  5.     this.toString = function(){  
  6.         return "base";  
  7.     };  
  8. };  
  9. Base.CONSTANT = "constant";  
  10.   
  11. var Sub = function()  
  12. {  
  13.     var instance = new Base();  
  14.     instance.name = "sub";  
  15.     return instance;  
  16. };  

優(yōu)點(diǎn):是父類的對(duì)象,并且使用new構(gòu)造對(duì)象和不使用new構(gòu)造對(duì)象,都可以獲得相同的效果。

缺點(diǎn):生成的對(duì)象實(shí)質(zhì)僅僅是父類的實(shí)例,并非子類的對(duì)象;不支持多繼承。

 

 

4、拷貝繼承:

Js代碼  收藏代碼
  1. var Base = function()  
  2. {  
  3.     this.level = 1;  
  4.     this.name = "base";  
  5.     this.toString = function(){  
  6.         return "base";  
  7.     };  
  8. };  
  9. Base.CONSTANT = "constant";  
  10.   
  11. var Sub = function()  
  12. {  
  13.     var base = new Base();  
  14.     for(var i in base)  
  15.         Sub.prototype[i] = base[i];  
  16.     Sub.prototype["name"] = "sub";  
  17. };  

優(yōu)點(diǎn):支持多繼承。

缺點(diǎn):效率較低;無法獲取父類不可枚舉的方法。

 

 

這幾種形式各有特點(diǎn),僅就我提供的代碼而言,滿足下面的表格:

 

instanceof父類instanceof子類子類constructor不可枚舉方法的繼承多繼承可實(shí)現(xiàn)
原型鏈繼承TRUETRUEFALSETRUEFALSE
構(gòu)造繼承FALSETRUETRUETRUETRUE
實(shí)例繼承TRUEFALSEFALSETRUEFALSE
拷貝繼承FALSETRUETRUEFALSETRUE

 

補(bǔ)充,如果我們不需要類繼承,只需要對(duì)象繼承,對(duì)于支持 ECMAScript 5 的瀏覽器來說,還可以用Object.create方法來實(shí)現(xiàn):

Js代碼  收藏代碼
  1. var Base = function()  
  2. {  
  3.     this.level = 1;  
  4.     this.name = "base";  
  5.     this.toString = function(){  
  6.         return "base";  
  7.     };  
  8. };  
  9. Base.CONSTANT = "constant";  
  10.   
  11. var sub = Object.create(new Base());  
  12. sub.name = "sub";  



類似接口 功能:
Java代碼  收藏代碼
  1. function Rect(){   
  2.   this.drawRect = function(){   
  3.     alert("rect");   
  4.   }   
  5. }   
  6.   
  7. function Person(obj){   
  8. //obj參數(shù)的格式:{doWhat,who}   
  9.   for(var i in obj){   
  10.     this.doWhat = i;   
  11.     this.who = obj[i];   
  12.     break;   
  13.   }   
  14.   this.draw = function(){   
  15.     this.who[this.doWhat].call(this.who);   
  16.   };   
  17. }   
  18.   
  19. var rou = { drawRound : new Round() };   
  20. var rec = { drawRect : new Rect() };   
  21. (new Person(rou)).draw();   
  22. (new Person(rec)).draw();  



更多重構(gòu)的知識(shí)請(qǐng)參看:http://raychase./blog/1174362

    本站是提供個(gè)人知識(shí)管理的網(wǎng)絡(luò)存儲(chǔ)空間,所有內(nèi)容均由用戶發(fā)布,不代表本站觀點(diǎn)。請(qǐng)注意甄別內(nèi)容中的聯(lián)系方式、誘導(dǎo)購(gòu)買等信息,謹(jǐn)防詐騙。如發(fā)現(xiàn)有害或侵權(quán)內(nèi)容,請(qǐng)點(diǎn)擊一鍵舉報(bào)。
    轉(zhuǎn)藏 分享 獻(xiàn)花(0

    0條評(píng)論

    發(fā)表

    請(qǐng)遵守用戶 評(píng)論公約

    類似文章 更多