首頁 > web前端 > js教程 > JavaScript prototype屬性深入介紹_javascript技巧

JavaScript prototype屬性深入介紹_javascript技巧

WBOY
發布: 2016-05-16 17:47:43
原創
978 人瀏覽過

每個函數在建立時預設帶有一個prototype屬性,其中包含一個constructor屬性,和一個指向Object物件的隱藏屬性__proto__。 constructor屬性的值為該函數的物件。在一個函數前面加上new來調用,則會建立一個隱藏連接到該函數prototype成員的新物件(由__proto__屬性來連結),同時函數的this將會被綁定到那個新物件上。
函數總是傳回一個值;如果沒有指定回傳值,就傳回undefined;如果當做建構函式來調用,且傳回值不是對象,則傳回this(該新物件);如果傳回值是對象,則它作為構造函數是沒有意義的!
[javascript]

複製程式碼 程式碼如下:

function({ 🎜>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, function(name, function(name, function) 🎜>this.prototype[name] = func;
return this;
};
Function.prototype.method = function(name, func){
this.prototype[name] = 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;
};
複製程式碼


程式碼如下:



程式碼如下:


var ;
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'}); 這樣,我們可以在建構器中定義一些私有變數(如字典表)和函數,而不必把它們全部暴露在外面。
相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板