JavaScript笔记：最详细的call函数和apply函数用法总结

昨天听了一堂直播，里面有教到关于forEach函数的源码编写，提到了call()和apply()函数，有点懵，这才发现之前我学的太快了，有很多细节没有注意，当进行实战时才发现漏了一些东西，现在开始查漏补缺。

今天就好好总结一下call()和apply()方法的应用。首先，这两个函数的作用完全一样，都是调用构造函数来构造自己的对象，并且还能够改变this的指向，区别就只是传参形式不一样。

/*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对象的方法。

call()

call函数，能够接收两个参数一个是Object，一个是args（默认参数），这个args是一个个零散的参数，用逗号隔开。

Function.call(Object,"参数列表");

这两个参数会被传递给被调用call方法的函数Function，并按Function的程序执行（参数列表的顺序对应的是Function里形参的顺序，名称可以不一样）。
Object会替代Function里的this，args作为实参传入被Function执行。

看一个call函数的例子：

function Say(word,sentence) {
    this.word = word;
    this.sentence = sentence;
}
function Eat(food,drinks) {
    this.food = food;
    this.drinks = drinks;
}
function People(word,sentence,food,drinks) {
	Say.call(this,word,sentence);
	Eat.call(this,food,drinks);
}
var xiaoming = new People("hello","how are you","bread","milk");
-----------------------------------------------------------
console.log(xiaoming);
People {word: "hello", sentence: "how are you", food: "bread", drinks: "milk"}

这里相当于构建了两个简单的基础框架，People直接调用。当通过People实例化一个对象xiaoming时，People里面的call函数里的this就是xiaoming，这个xiaoming带着实参通过call方法，传入到被调用的构造函数里，取代了被调用函数中的this，执行完构造函数后，将结果返回。

这里注意一下，call里的第一位参数this不是非得写成this，任何Object都可以，它的目的是把被调用函数里的this改变成这个call里所传进去的这个this对象。

只不过在这里，用this恰好可以表示我们要传进去的对象，也就是被实例化的对象，就是这么个逻辑。

apply()

apply()的第一个参数作用和call()是一样的，只不过apply()的第二个参数是个args，obj和args同样被传入到被调用构造函数中执行，返回结果。

args可以是数组或类数组，apply函数把这个集合中的元素作为参数传递给被调用的函数。

Function.apply(Object,args);

还是利用上边的例子来进行演示：

function Say(word,sentence) {
    this.word = word;
    this.sentence = sentence;
}
function Eat(food,drinks) {
    this.food = food;
    this.drinks = drinks;
}
function People(word,sentence,food,drinks) {
	Say.apply(this,[word,sentence]); //参数列表改为数组
	Eat.apply(this,[food,drinks]);
}
var xiaoming = new People("hello","how are you","bread","milk");
-----------------------------------------------------------
console.log(xiaoming); //输出结果不变
People {word: "hello", sentence: "how are you", food: "bread", drinks: "milk"}

总结

call函数和apply函数都是调用构造函数实例化自己的对象，并能够改变this指向，区别在于传参形式的不同。