JavaScript prototype屬性深入介紹
函數(shù)總是返回一個(gè)值;如果沒有指定返回值,就返回undefined;如果當(dāng)做構(gòu)造函數(shù)來調(diào)用,且返回值不是對(duì)象,則返回this(該新對(duì)象);如果返回值是對(duì)象,則它作為構(gòu)造函數(shù)是沒有意義的!
[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();的效果一樣
函數(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]
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]
Object.method('method',Object.method);
Object.method('method',Object.method);
我們可以通過修改數(shù)值類型的原型,來給數(shù)值類型增加新的方法,這里我們借用上一條中提到的method方法來給Number的原型增加一個(gè)negative方法:
[javascript]
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]
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]
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]
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è)例子:
[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'});
這樣,我們可以在構(gòu)造器中定義一些私有變量(如字典表)和函數(shù),而不必把它們?nèi)勘┞对谕饷妗?
- js中繼承的幾種用法總結(jié)(apply,call,prototype)
- JavaScript prototype 使用介紹
- js中prototype用法詳細(xì)介紹
- JavaScript中的prototype使用說明
- 不錯(cuò)的一篇關(guān)于javascript-prototype繼承
- JS 面向?qū)ο笾衿娴膒rototype
- 詳解Javascript中prototype屬性(推薦)
- 深入了解javascript中的prototype與繼承
- javascript prototype的深度探索不是原型繼承那么簡(jiǎn)單
- Javascript中的Prototype到底是什么
- javascript Prototype 對(duì)象擴(kuò)展
- Javascript中prototype與__proto__的關(guān)系詳解
相關(guān)文章
js+html5實(shí)現(xiàn)可在手機(jī)上玩的拼圖游戲
這篇文章主要介紹了js+html5實(shí)現(xiàn)可在手機(jī)上玩的拼圖游戲,涉及javascript結(jié)合html5進(jìn)行圖形操作的相關(guān)技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2015-07-07
js 將多個(gè)對(duì)象合并成一個(gè)對(duì)象 assign方法的實(shí)現(xiàn)
這篇文章主要介紹了js 將多個(gè)對(duì)象合并成一個(gè)對(duì)象 assign方法的實(shí)現(xiàn),文中通過示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2020-09-09
基于rollup的組件庫打包體積優(yōu)化小結(jié)
這篇文章主要介紹了基于rollup的組件庫打包體積優(yōu)化小結(jié),小編覺得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過來看看吧2018-06-06
JavaScript實(shí)現(xiàn)可動(dòng)的canvas環(huán)形進(jìn)度條
這篇文章主要介紹了如何利用JavaScript canvas繪制一個(gè)可以動(dòng)的環(huán)形進(jìn)度條。文中的示例代碼講解詳細(xì),感興趣的小伙伴可以動(dòng)手試一試2022-02-02
基于JavaScript實(shí)現(xiàn)自定義滾動(dòng)條
這篇文章主要為大家詳細(xì)介紹了基于JavaScript實(shí)現(xiàn)自定義滾動(dòng)條,可以直接使用的滾動(dòng)條,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2017-01-01
js中如何復(fù)制一個(gè)對(duì)象并獲取其所有屬性和屬性對(duì)應(yīng)的值
如果知道這個(gè)對(duì)象的所有屬性自然就可以重新new一個(gè),然后對(duì)每個(gè)屬性賦值,就可以做到,但如果不知道呢?如何創(chuàng)建一個(gè)內(nèi)容相同 的對(duì)象呢?下面有個(gè)不錯(cuò)的示例,大家可以看看2013-10-10
JavaScript 數(shù)組去重并統(tǒng)計(jì)重復(fù)元素出現(xiàn)的次數(shù)實(shí)例
下面小編就為大家分享一篇JavaScript 數(shù)組去重并統(tǒng)計(jì)重復(fù)元素出現(xiàn)的次數(shù)實(shí)例,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。一起跟隨小編過來看看吧2017-12-12
Bootstrap table 服務(wù)器端分頁功能實(shí)現(xiàn)方法示例
這篇文章主要介紹了Bootstrap table 服務(wù)器端分頁功能實(shí)現(xiàn)方法,結(jié)合實(shí)例形式詳細(xì)分析了Bootstrap table 服務(wù)器端后臺(tái)交互與分頁功能相關(guān)操作技巧,需要的朋友可以參考下2020-06-06

