資源描述：
《05：強(qiáng)大的原型和原型鏈》由會(huì)員上傳分享，免費(fèi)在線閱讀，更多相關(guān)內(nèi)容在教育資源-天天文庫(kù)。
1、強(qiáng)大的原型和原型鏈前言JavaScript不包含傳統(tǒng)的類繼承模型，而是使用prototypal原型模型。雖然這經(jīng)常被當(dāng)作是JavaScript的缺點(diǎn)被提及，其實(shí)基于原型的繼承模型比傳統(tǒng)的類繼承還要強(qiáng)大。實(shí)現(xiàn)傳統(tǒng)的類繼承模型是很簡(jiǎn)單，但是實(shí)現(xiàn)JavaScript中的原型繼承則要困難的多。由于JavaScript是唯一一個(gè)被廣泛使用的基于原型繼承的語(yǔ)言，所以理解兩種繼承模式的差異是需要一定時(shí)間的，今天我們就來(lái)了解一下原型和原型鏈。原型10年前，我剛學(xué)習(xí)JavaScript的時(shí)候，一般都是用如下方式來(lái)寫代碼：vardecim
2、alDigits=2,tax=5;functionadd(x,y){returnx+y;}functionsubtract(x,y){returnx-y;}//alert(add(1,3));通過(guò)執(zhí)行各個(gè)function來(lái)得到結(jié)果，學(xué)習(xí)了原型之后，我們可以使用如下方式來(lái)美化一下代碼。原型使用方式1：在使用原型之前，我們需要先將代碼做一下小修改：varCalculator=function(decimalDigits,tax){this.decimalDigits=decimalDigits;this.tax=tax;}
3、;然后，通過(guò)給Calculator對(duì)象的prototype屬性賦值對(duì)象字面量來(lái)設(shè)定Calculator對(duì)象的原型。Calculator.prototype={add:function(x,y){returnx+y;},subtract:function(x,y){returnx-y;}};//alert((newCalculator()).add(1,3));這樣，我們就可以newCalculator對(duì)象以后，就可以調(diào)用add方法來(lái)計(jì)算結(jié)果了。原型使用方式2：第二種方式是，在賦值原型prototype的時(shí)候使用func
4、tion立即執(zhí)行的表達(dá)式來(lái)賦值，即如下格式：Calculator.prototype=function(){}();它的好處在前面的帖子里已經(jīng)知道了，就是可以封裝私有的function，通過(guò)return的形式暴露出簡(jiǎn)單的使用名稱，以達(dá)到public/private的效果，修改后的代碼如下：Calculator.prototype=function(){add=function(x,y){returnx+y;},subtract=function(x,y){returnx-y;}return{add:add,subtra
5、ct:subtract}}();//alert((newCalculator()).add(11,3));同樣的方式，我們可以newCalculator對(duì)象以后調(diào)用add方法來(lái)計(jì)算結(jié)果了。再來(lái)一點(diǎn)分步聲明：上述使用原型的時(shí)候，有一個(gè)限制就是一次性設(shè)置了原型對(duì)象，我們?cè)賮?lái)說(shuō)一下如何分來(lái)設(shè)置原型的每個(gè)屬性吧。varBaseCalculator=function(){//為每個(gè)實(shí)例都聲明一個(gè)小數(shù)位數(shù)this.decimalDigits=2;};//使用原型給BaseCalculator擴(kuò)展2個(gè)對(duì)象方法BaseCalculat
6、or.prototype.add=function(x,y){returnx+y;};BaseCalculator.prototype.subtract=function(x,y){returnx-y;};首先，聲明了一個(gè)BaseCalculator對(duì)象，構(gòu)造函數(shù)里會(huì)初始化一個(gè)小數(shù)位數(shù)的屬性decimalDigits，然后通過(guò)原型屬性設(shè)置2個(gè)function，分別是add(x,y)和subtract(x,y)，當(dāng)然你也可以使用前面提到的2種方式的任何一種，我們的主要目的是看如何將BaseCalculator對(duì)象設(shè)置到真
7、正的Calculator的原型上。varBaseCalculator=function(){this.decimalDigits=2;};BaseCalculator.prototype={add:function(x,y){returnx+y;},subtract:function(x,y){returnx-y;}};創(chuàng)建完上述代碼以后，我們來(lái)開(kāi)始：varCalculator=function(){//為每個(gè)實(shí)例都聲明一個(gè)稅收數(shù)字this.tax=5;};Calculator.prototype=newBaseCal
8、culator();我們可以看到Calculator的原型是指向到BaseCalculator的一個(gè)實(shí)例上，目的是讓Calculator集成它的add(x,y)和subtract(x,y)這2個(gè)function，還有一點(diǎn)要說(shuō)的是，由于它的原型是BaseCalculator的一個(gè)實(shí)例，所以不管你創(chuàng)建多少個(gè)Calculator對(duì)象實(shí)例
