JS call 和 apply的区别

call 和 apply 这两个方法平时都用的比较少，所以可能会比较陌生，刚好昨天有同事问我，顺便重新梳理了一下：
首先看定义：

apply：调用一个对象的一个方法，用另一个对象替换当前对象。例如：B.apply(A, arguments);即A对象应用B对象的方法。
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);

在这里插入图片描述
是不是很清晰啦，继续加油

JS call 和 apply的区别

猜你喜欢