快捷導(dǎo)航

JavaScript prototype屬性深入介紹

更新時(shí)間：2012年11月27日 09:43:58 作者：

每個(gè)函數(shù)創(chuàng)建時(shí)默認(rèn)帶有一個(gè)prototype屬性，其中包含一個(gè)constructor屬性，和一個(gè)指向Object對(duì)象的隱藏屬性,需要的朋友可以參考下

每個(gè)函數(shù)創(chuàng)建時(shí)默認(rèn)帶有一個(gè)prototype屬性，其中包含一個(gè)constructor屬性，和一個(gè)指向Object對(duì)象的隱藏屬性__proto__。constructor屬性的值為該函數(shù)的對(duì)象。在一個(gè)函數(shù)前面加上new來調(diào)用，則會(huì)創(chuàng)建一個(gè)隱藏連接到該函數(shù)prototype成員的新對(duì)象（由__proto__屬性來鏈接），同時(shí)函數(shù)的this將會(huì)被綁定到那個(gè)新對(duì)象上。
函數(shù)總是返回一個(gè)值；如果沒有指定返回值，就返回undefined；如果當(dāng)做構(gòu)造函數(shù)來調(diào)用，且返回值不是對(duì)象，則返回this（該新對(duì)象）；如果返回值是對(duì)象，則它作為構(gòu)造函數(shù)是沒有意義的！
[javascript]

復(fù)制代碼代碼如下:

 
function A(){ 
this.p = 'haha'; 
return {p:'heihei'}; 
} 
var a = new A(); 
function A(){ 
this.p = 'haha'; 
return {p:'heihei'}; 
} 
var a = new A(); 
alert(a.p);//顯示'heihei'，與var a = A();的效果一樣 

函數(shù)A內(nèi)部直接調(diào)用一個(gè)函數(shù)B，B的this綁定到全局對(duì)象而不是其外部函數(shù)A，這是JS設(shè)計(jì)的一個(gè)錯(cuò)誤。我們不得不用別的方式來解決這個(gè)問題，比如在A中用一個(gè)變量（通常是that）來保存A的this作用域的引用。
JS函數(shù)擁有一個(gè)length屬性，表示函數(shù)定義時(shí)指定的形參的個(gè)數(shù)。
函數(shù)的arguments屬性包含了調(diào)用函數(shù)時(shí)傳入的所有參數(shù)，而不管函數(shù)的聲明中是否定義了這些形參；arguments不是數(shù)組，只是一個(gè)“類似數(shù)組”的對(duì)象（在函數(shù)中運(yùn)行arguments instanceof Array;返回false）。可以通過Array.prototype.slice.apply(arguments)將其轉(zhuǎn)化為JS數(shù)組。
給JavaScript函數(shù)的原型增加方法（method），則所有的（構(gòu)造）函數(shù)都可以用了！例如，可以給JS函數(shù)的構(gòu)造者 Function 的原型增加一個(gè)method方法，則包括Object、Number等構(gòu)造函數(shù)在內(nèi)的所有函數(shù)都繼承了該方法，這是很強(qiáng)大的：
[javascript]

復(fù)制代碼代碼如下:

 
Function.prototype.method = function(name, func){ 
this.prototype[name] = func; 
return this; 
}; 
Function.prototype.method = function(name, func){ 
this.prototype[name] = func; 
return this; 
}; 

這樣，調(diào)用Object.method方法，就可以為所有的JS對(duì)象（包括Function對(duì)象）增加新的方法，調(diào)用Number.method方法，可以為所有的數(shù)值類型增加新的方法，下面一條就是這樣的一個(gè)例子。注意Object、Number等類型的對(duì)象此時(shí)并沒有繼承method方法。如果想達(dá)到這樣的目的，可以運(yùn)行類似下面的語句：
[javascript]

復(fù)制代碼代碼如下:

 
Object.method('method',Object.method); 
Object.method('method',Object.method); 

我們可以通過修改數(shù)值類型的原型，來給數(shù)值類型增加新的方法，這里我們借用上一條中提到的method方法來給Number的原型增加一個(gè)negative方法：
[javascript]

復(fù)制代碼代碼如下:

 
Number.method(negative,function(){ 
return 0–this; 
}) 
Number.method(negative,function(){ 
return 0–this; 
}) 

調(diào)用方法的時(shí)候稍微有一點(diǎn)繞。在JavaScript的語法中，數(shù)字后面直接跟點(diǎn)號(hào)，然后跟方法調(diào)用的語法是錯(cuò)誤的；也就是說，3.negative()這樣寫是不對(duì)的。要想調(diào)用數(shù)值類型的方法，需要在數(shù)字后面加n個(gè)空格（n>=1），或者使用小括號(hào)將數(shù)字括起來，將其強(qiáng)制轉(zhuǎn)化為表達(dá)式，然后再調(diào)用方法，或者干脆定義一個(gè)數(shù)值變量，也可以直接調(diào)用方法。也就是說，下面的寫法都是正確的：
[javascript]
(3).negative();
3 .negative();
var n = 3; n.negative();
3['negative']();
(3).negative();
3 .negative();
var n = 3; n.negative();
3['negative']();
當(dāng)使用函數(shù)表達(dá)式方法定義函數(shù)時(shí)，function后面的函數(shù)名可以用來遞歸地調(diào)用自己，并且這個(gè)名字不會(huì)被覆蓋！我們來看下面的例子，
[javascript]

復(fù)制代碼代碼如下:

 
function a(n){ 
if(n>1) 
return a(n-1)+1; 
else 
return 1; 
}; 
function a(n){ 
if(n>1) 
return a(n-1)+1; 
else 
return 1; 
}; 

上述代碼定義了一個(gè)函數(shù)a，并且其內(nèi)部遞歸對(duì)自身進(jìn)行了調(diào)用；現(xiàn)在我們用一個(gè)新的引用aa指向函數(shù)a，然后將原來的a改變，比如變?yōu)橐粋€(gè)整數(shù)1，然后調(diào)用函數(shù)aa，如下面代碼所示：
[javascript]

復(fù)制代碼代碼如下:

 
var aa = a; 
a = 1; 
aa(3); 
var aa = a; 
a = 1; 
aa(3); 

則控制臺(tái)報(bào)錯(cuò)：TypeError: Property 'a' of object [object Window] is not a function；很顯然，原來的遞歸函數(shù)已經(jīng)被破壞了。關(guān)于這個(gè)問題，我們可以在函數(shù)a的內(nèi)部，用arguments.callee.caller來代替a，或者用一個(gè)函數(shù)表達(dá)式來定義函數(shù)：
[javascript]

復(fù)制代碼代碼如下:

 
var b = function a(n){ 
if(n>1) 
return a(n-1)+1; 
else 
return 1; 
}; 
var bb = b; 
a = 3; 
bb(3); 
var b = function a(n){ 
if(n>1) 
return a(n-1)+1; 
else 
return 1; 
}; 
var bb = b; 
a = 3; 
bb(3); 

此時(shí)，bb函數(shù)能正確返回我們想要的結(jié)果。
為了提高JavaScript函數(shù)的封裝性，我們可以定義函數(shù)化的構(gòu)造器，下面是一個(gè)例子：

復(fù)制代碼代碼如下:

 
[javascript] 
var funcCons = function(spec){ 
var that = {}; 
that.getName = function(){ 
return spec.name; 
}; 
that.says = function(){ 
return spec.saying || ''; 
}; 
return that; 
}; 
var myFunc = funcCons({name:'NearEast'}); 
var funcCons = function(spec){ 
var that = {}; 
that.getName = function(){ 
return spec.name; 
}; 
that.says = function(){ 
return spec.saying || ''; 
}; 
return that; 
}; 
var myFunc = funcCons({name:'NearEast'}); 