1. 程式人生 > >JS call 和 apply的區別

JS call 和 apply的區別

call 和 apply 這兩個方法平時都用的比較少,所以可能會比較陌生,剛好昨天有同事問我,順便重新梳理了一下:
首先看定義:

  1. apply:呼叫一個物件的一個方法,用另一個物件替換當前物件。例如:B.apply(A, arguments);即A物件應用B物件的方法。
  2. call:呼叫一個物件的一個方法,用另一個物件替換當前物件。例如:B.call(A, args1,args2);即A物件呼叫B物件的方法

all 與 apply 的相同點:
方法的含義是一樣的,即方法功能是一樣的;
call 與 apply 的不同點:
兩者傳入的列表形式不一樣:call可以傳入多個引數;apply只能傳入兩個引數,所以其第二個引數往往是作為陣列形式傳入
1.小例子

function add(num1 , num2){
  return num1 + num2;  
}
function sub(num1 , num2){
  return num1 - num2;  
}
var sum1 = add.apply(sub,[8,6]);
var sum2 = sub.apply(add,[8,6]);
console.log(sum1);  // 14
console.log(sum2);  //  2
var sum3 = add.call(sub,8,6);
var sum4 = sub.call(add,8,6);
console.log(sum3);  // 14
console.log(sum4);  //  2

可以看出只是用法不同,結果是一樣。

2.可以實現繼承:

function Person(name){
  this.name = name;
  this.logName = function(){
        console.log(this.name);    
    }    
}
function BigChao(name){
  Person.apply(this,[name]);    
  //call 的寫法
  //Person.call(this,name); 
}
var chao = new BigChao("超");
chao.showName();

是不是挺簡單的,我也網上找了點資料,有一些巧妙的用法,大家也可以參考一下:
Math.max(param1 , param2 , param3…)的寫法是這樣的,不支援Math.max([param1 , param2 , param3…])這種寫法,我們運用apply方法傳入一個數組的方式來改造:
Math.min.apply( null , array[] )即可

var arr = [1,2,3,4,5,6,7,8,9];
console.log(Math.max.apply(this , arr));  //結果為9
//同理
var arr = [1,2,3,4,5,6,7,8,9];
console.log(Math.min.apply(this , arr));  //結果為1

Array.prototype.push實現兩個陣列的合併:

var arr1 = new Array("1","2","3");
var arr2 = new Array("101","102","103");
arr1.push(['4','5','6']);
arr2.push('104','105','106');
console.log(arr1);
console.log(arr2);
var arr3 = new Array("1","2","3");
var arr4 = new Array("101","102","103");
var length = Array.prototype.push.apply(arr1 , arr2);
console.log(length);
console.log(arr3);
console.log(arr4);

在這裡插入圖片描述
是不是很清晰啦,繼續加油