call與apply函數(shù)怎么在JavaScript中使用

call與apply函數(shù)怎么在JavaScript中使用？相信很多沒有經(jīng)驗(yàn)的人對(duì)此束手無策，為此本文總結(jié)了問題出現(xiàn)的原因和解決方法，通過這篇文章希望你能解決這個(gè)問題。

公司主營(yíng)業(yè)務(wù)：成都網(wǎng)站制作、做網(wǎng)站、移動(dòng)網(wǎng)站開發(fā)等業(yè)務(wù)。幫助企業(yè)客戶真正實(shí)現(xiàn)互聯(lián)網(wǎng)宣傳，提高企業(yè)的競(jìng)爭(zhēng)能力。創(chuàng)新互聯(lián)公司是一支青春激揚(yáng)、勤奮敬業(yè)、活力青春激揚(yáng)、勤奮敬業(yè)、活力澎湃、和諧高效的團(tuán)隊(duì)。公司秉承以“開放、自由、嚴(yán)謹(jǐn)、自律”為核心的企業(yè)文化，感謝他們對(duì)我們的高要求，感謝他們從不同領(lǐng)域給我們帶來的挑戰(zhàn)，讓我們激情的團(tuán)隊(duì)有機(jī)會(huì)用頭腦與智慧不斷的給客戶帶來驚喜。創(chuàng)新互聯(lián)公司推出道外免費(fèi)做網(wǎng)站回饋大家。

call 函數(shù)

語法

obj.call(thisObj,arg[,arg2[,arg3[,...agr]]]);

簡(jiǎn)介

thisObj繼承obj的屬性和方法(obj原型鏈上的屬性和方法不能被繼承),后面的參數(shù)會(huì)當(dāng)成obj的參數(shù)安裝順序傳遞進(jìn)去。

示例

function animal(type,nickname){
    this.type = type;
    this.nickname = nickname;
    this.sayHello = function(){
      return 'hello';
    }
}
function cat(name,type,nickname){
    this.name = name;
    //cat繼承animal
    animal.call(this,type,nickname);
}
console.log(new cat('wsscat','cut','tom'));
/*
cat {
 name: 'wsscat',
 type: 'cut',
 nickname: 'tom',
 sayHello: [Function] }
*/

apply 函數(shù)

語法

obj.apply(this[,argArray]);

簡(jiǎn)介

apply和call的作用差不多，都可以用來繼承，區(qū)別在與apply只有兩個(gè)參數(shù)，第二個(gè)參數(shù)必須是數(shù)組或者arguments對(duì)象。否則會(huì)報(bào)TypeError錯(cuò)誤。如果繼承的對(duì)象obj有多個(gè)參數(shù)，則會(huì)吧argArray的參數(shù)依次對(duì)應(yīng)obj的每個(gè)參數(shù)。

示例

function animal(type,nickname){
    this.type = type;
    this.nickname = nickname;
    this.syaHello = function(){
      return 'hello';
    }
}
function cat(name,type,nickname){
    this.name = name;
    animal.apply(this,arguments);
}
console.log(new cat('wsscat','cut','tom'));
/*
cat {
 name: 'wsscat',
 type: 'wsscat',
 nickname: 'cut',
 syaHello: [Function] }
*/

總結(jié)

call和apply在功能是相同的。

相同點(diǎn)在于都是用于對(duì)象的繼承，第一個(gè)參數(shù)都是thisObj.

不同點(diǎn)在于call可以有多個(gè)參數(shù)，從第二個(gè)參數(shù)開始往后的參數(shù)會(huì)依次傳給被繼承的對(duì)象做參數(shù)。apply只有兩個(gè)參數(shù)，第二個(gè)參數(shù)必須是數(shù)組類型或者arguments對(duì)象類型，而且他會(huì)把數(shù)組中的元素依次傳遞給被繼承的對(duì)象做參數(shù)。

通過以上幾點(diǎn)，我們可以得到如果被繼承的對(duì)象只有一個(gè)參數(shù)的可以使用call，如果被繼承的對(duì)象有多個(gè)參數(shù)的，建議使用apply.

補(bǔ)充

js中可以實(shí)現(xiàn)多繼承，只需要調(diào)用多次call或apply即可。如：

function animal(type,nickname){
    this.type = type;
    this.nickname = nickname;
    this.syaHello = function(){
      return 'hello';
    }
}
function wscat(name,age){
    this.name = name;
    this.age = age;
    this.sayMe = function(){
      return 'my name:' + this.name + ', age:' + this.age;
    }
}
function cat(name,age,type,nickname){
    //第一種使用call
    animal.call(this,type,nickname);
    wscat.call(this,name,age);
    //第二種使用apply
    //animal.apply(this,[type,nickname]);
    //wscat.apply(this,[name,age]);
}
console.log(new cat('wscat',2,'cat','tom');
/*
cat {
 type: 'cat',
 nickname: 'tom',
 syaHello: [Function],
 name: 'wscat',
 age: 2,
 sayMe: [Function] }
*/

繼承的優(yōu)化

如果構(gòu)造函數(shù)this綁定了太多的屬性(比如一些共用的函數(shù)),示例化后就會(huì)照成浪費(fèi)(因?yàn)閠his里的屬性和方法實(shí)例化后會(huì)復(fù)制一份給新對(duì)象，多個(gè)對(duì)象之間的屬性和方法互不干涉，對(duì)于一些可以共用的方法來就會(huì)造成浪費(fèi))

所以我們一般把共用的函數(shù)都放在原型鏈(prototype)上。但是使用call和apply無法繼承原型鏈上的屬性和方法。

因此我們可以使用混合的而寫法，使用原型鏈和(apply或call)組合的方式進(jìn)行繼承。

讓子的原型鏈指向父的示例(父的實(shí)例化對(duì)象)。如：

cat.prototype = new animal();

讓父的屬性創(chuàng)建在子的this上。如：

animal.call(this[,arg]);
//animal.apply(this[,argArray]);

具體代碼如下：

function animal(type,nickname){
    this.type = type;
    this.nickname = nickname;
}
animal.prototype.sayHello = function(){
    return 'hello';
}
function wscat(name,age){
    this.name = name;
    this.age = age;
} 
//這里是關(guān)鍵，原型鏈只能單繼承，
//不能同時(shí)繼承多個(gè)原型鏈，所以要一級(jí)一級(jí)來。
wscat.prototype = new animal();
wscat.prototype.sayMe = function(){
    return 'my name:' + this.name + ', age:' + this.age;
}
function cat(name,age,type,nickname){
    animal.call(this,type,nickname);
    wscat.call(this,name,age);
}
cat.prototype = new wscat();
var obj = new cat('wscat',10,'cat','tom');
console.log(obj);
//animal { type: 'cat', nickname: 'tom', name: 'wscat', age: 10 }
console.log(obj.sayHello());//hello
console.log(obj.sayMe());
/*
    my name:wscat, age:10
*/

看完上述內(nèi)容，你們掌握call與apply函數(shù)怎么在JavaScript中使用的方法了嗎？如果還想學(xué)到更多技能或想了解更多相關(guān)內(nèi)容，歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道，感謝各位的閱讀！

新聞標(biāo)題：call與apply函數(shù)怎么在JavaScript中使用
路徑分享：http://muchs.cn/article6/pdghog.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供Google、軟件開發(fā)、網(wǎng)站改版、定制網(wǎng)站、外貿(mào)建站、服務(wù)器托管

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請(qǐng)盡快告知，我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng)，如需處理請(qǐng)聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來源： 創(chuàng)新互聯(lián)

成都定制網(wǎng)站建設(shè)