JavaScript prototype屬性深入介紹

來源:互聯網
上載者:User

每個函數建立時預設帶有一個prototype屬性,其中包含一個constructor屬性,和一個指向Object對象的隱藏屬性__proto__。constructor屬性的值為該函數的對象。在一個函數前面加上new來調用,則會建立一個隱藏串連到該函數prototype成員的新對象(由__proto__屬性來連結),同時函數的this將會被綁定到那個新對象上。
函數總是返回一個值;如果沒有指定傳回值,就返回undefined;如果當做建構函式來調用,且傳回值不是對象,則返回this(該新對象);如果傳回值是對象,則它作為建構函式是沒有意義的!
[javascript] 複製代碼 代碼如下: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();的效果一樣

函數A內部直接調用一個函數B,B的this綁定到全域對象而不是其外部函數A,這是JS設計的一個錯誤。我們不得不用別的方式來解決這個問題,比如在A中用一個變數(通常是that)來儲存A的this範圍的引用。
JS函數擁有一個length屬性,表示函數定義時指定的形參的個數。
函數的arguments屬性包含了調用函數時傳入的所有參數,而不管函數的聲明中是否定義了這些形參;arguments不是數組,只是一個“類似數組”的對象(在函數中運行arguments instanceof Array;返回false)。可以通過Array.prototype.slice.apply(arguments)將其轉化為JS數組。
給JavaScript函數的原型增加方法(method),則所有的(構造)函數都可以用了!例如,可以給JS函數的構造者 Function 的原型增加一個method方法,則包括Object、Number等建構函式在內的所有函數都繼承了該方法,這是很強大的:
[javascript] 複製代碼 代碼如下:Function.prototype.method = function(name, func){
this.prototype[name] = func;
return this;
};
Function.prototype.method = function(name, func){
this.prototype[name] = func;
return this;
};

這樣,調用Object.method方法,就可以為所有的JS對象(包括Function對象)增加新的方法,調用Number.method方法,可以為所有的數實值型別增加新的方法,下面一條就是這樣的一個例子。 注意Object、Number等類型的對象此時並沒有繼承method方法。如果想達到這樣的目的,可以運行類似下面的語句:
[javascript] 複製代碼 代碼如下:Object.method('method',Object.method);
Object.method('method',Object.method);

我們可以通過修改數實值型別的原型,來給數實值型別增加新的方法,這裡我們借用上一條中提到的method方法來給Number的原型增加一個negative方法:
[javascript] 複製代碼 代碼如下:Number.method(negative,function(){
return 0–this;
})
Number.method(negative,function(){
return 0–this;
})

調用方法的時候稍微有一點繞。在JavaScript的文法中,數字後面直接跟點號,然後跟方法調用的文法是錯誤的;也就是說,3.negative()這樣寫是不對的。要想調用數實值型別的方法,需要在數字後面加n個空格(n>=1),或者使用小括弧將數字括起來,將其強制轉化為運算式,然後再調用方法,或者乾脆定義一個數值變數,也可以直接調用方法。也就是說,下面的寫法都是正確的:
[javascript]
(3).negative();
3 .negative();
var n = 3; n.negative();
3['negative']();
(3).negative();
3 .negative();
var n = 3; n.negative();
3['negative']();
當使用函數運算式方法定義函數時,function後面的函數名可以用來遞迴地調用自己,並且這個名字不會被覆蓋!我們來看下面的例子,
[javascript] 複製代碼 代碼如下: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;
};

上述代碼定義了一個函數a,並且其內部遞迴對自身進行了調用;現在我們用一個新的引用aa指向函數a,然後將原來的a改變,比如變為一個整數1,然後調用函數aa,如下面代碼所示:
[javascript] 複製代碼 代碼如下:var aa = a;
a = 1;
aa(3);
var aa = a;
a = 1;
aa(3);

則控制台報錯:TypeError: Property 'a' of object [object Window] is not a function;很顯然,原來的遞迴函式已經被破壞了。關於這個問題,我們可以在函數a的內部,用arguments.callee.caller來代替a,或者用一個函數運算式來定義函數:
[javascript] 複製代碼 代碼如下: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);

此時,bb函數能正確返回我們想要的結果。
為了提高JavaScript函數的封裝性,我們可以定義函數化的構造器,下面是一個例子: 複製代碼 代碼如下:[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'});

這樣,我們可以在構造器中定義一些私人變數(如字典表)和函數,而不必把它們全部暴露在外面。

相關文章

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.