博客 / 詳情

返回

apply()與call()的區別

apply()和call()的區別在面試題中很常見,娓娓道來的是什麼apply()和call()唯一的區別就是接收的參數格式不一樣,一個是數組,一個是參數列表。。。但是一直沒有深究,都是很淺顯的一知半解,就用這篇文章好好的學習一下二者有什麼不同吧。

語法和基本定義
/*apply()方法*/
function.apply(thisObj[,argArray])

/*call()方法*/
function.call(thisObj[,arg1[,arg2[,[,...argN]]]]);
定義:

apply:調用一個對象的一個方法,用另一個對象替換當前對象。例如:B.apply(A,arguments);即A對象應用B對象的方法。
call:調用一個對象的一個方法,用另一個對象替換當前對象。例如:B.call(A,args1,args2);即A對象調用B對象的方法。

共同之處:

都可以用來替代另一個對象調用一個方法,將一個函數的對象上下文改變為由thisObj指定的新對象。

不同之處:

apply:最多隻能有兩個參數——新this對象和一個數組argArray。如果該方法傳遞多個參數,則把參數都寫進這個數組裏面,當然,即使只有一個參數,也要寫進數組裏。如果argArray不是一個有效的數組或arguments對象,那麼將導致一個TypeError.如果沒有提供argArray和thisObj任何一個參數,那麼Global對象將被用作thisObj,並且無法被傳遞任何參數。
call:它可以接收多個參數,第一個參數與apply一樣,後面則是一串參數列表。這個方法主要用在js對象個方法相互調用的時候,使當前this實例指針保持一致,或者在特殊情況下需要改變this指針。如果沒有提供thisObj參數,那麼Global對象被用作thisObj。
實際上,apply和call的功能是一樣的,只是傳入的參數列表形式不同。

示例代碼:

(1)基本用法

function add(a,b){
    return a+b;
}
function sub(a,b){
    return a-b;
}
var a1 = add.apply(sub,[4,2]); //sub調用add的方法
var a2 = sub.apply(add,[4,2]);
alert(a1);//6
alert(a2);//2

/*call的用法*/
var a1 = add.call(sub,4,2)

(2)實現繼承

function Animal(name){
    this.name = name;
    this.showName = function(){
        alert(this.name);
    }
}

function Cat(name){
    Animal.apply(this,[name])
}

var cat = new Cat("哈哈");
cat.showName();

/*call的用法*/
Animal.call(this,name);

(3)多重繼承

function Class10(){
    this.showSub = function(a,b){
        alert(a-b);
    }
}
function Class11(){
    this.showAdd = function(a,b){
        alert(a+b);
    }
}
function Class12(){
    Class10.apply(this);
    Class11.apply(this);
}

var c2 = new Class12();
c2.showSub(3,1); //2
c2.showAdd(3,1); //4
apply的一些其他巧妙用法

(1)Math.max可以實現得到數組中最大的一項:
因為Math.max不支持Math.max([param1,param2])也就是數組,但是他支持Math.max(param1,param2...),所以可以根據apply的特點來解決var max=Math.max.apply(null,array),這樣就輕易可以得到一個數組中的最大項(apply會將一個數組轉換為一個參數接一個參數的方式傳遞給方法)
這塊在調用的時候第一個參數給了null,這是因為沒有對象去調用這個方法,我只需要用這個方法幫我運算,得到返回的結果就行,所以直接傳遞了一個null過去。
用這種方法也可以實現得到數組中的最小項:Math.min.apply(null,array)
(2)Array.prototype.push可以實現兩個數組的合併
同樣push方法沒有提供push一個數組,但是它提供了push(param1,param2...paramN),同樣也可以用apply來轉換一下這個數組,即:

var arr1 = new Array("1","2","3")
var arr2 = new Array("4","5","6")
Array.prototype.push.apply(arr1,arr2); //得到合併後數組的長度,因為push就是返回一個數組的長度

也可以這樣理解,arr1調用了push方法,參數是通過apply將數組轉換為參數列表的集合,通常在什麼情況下,可以使用apply類似Math.max等之類的特殊用法:
一般在目標函數只需要n個參數列表,而不接收一個數組的形式,可以通過apply的方式巧妙的解決這個問題。

//求數組中的最大項
var arr=[1,3,5,6,23,4,56,767]
var max=Math.max.apply(null,arr)
alert(max);

//求數組中的最小項
var min=Math.min.apply(null,arr);
alert(min)

//合併兩個數組並返回新數組的長度
var arr1 = new Array("1","3","5","7","9");
var arr2 = new Array("2","4","6","8");
console.log(Array.prototype.push.apply(arr1,arr2));//返回數組的長度
user avatar
0 位用戶收藏了這個故事!

發佈 評論

Some HTML is okay.