这里是修真院前端小课堂，每篇分享文从
【背景介绍】【知识剖析】【常见问题】【解决方案】【编码实战】【扩展思考】【更多讨论】【参考文献】
八个方面深度解析前端知识/技能，本篇分享的是：
【如何理解JS中的call及apply】
1.背景介绍
在 javascript 中，call 和 apply 都是为了改变某个函数运行时的上下文（context）而存在的，换句话说，就是为了改变函数体内部 this 的指向。 JavaScript 的一大特点是，函数存在「定义时上下文」和「运行时上下文」以及「上下文是可以改变的」这样的概念。
2.知识剖析
call和apply的定义
1.call()方法调用具有给定this值的函数和单独提供的参数。说白了就是改变this的指向
2.apply()方法调用具有给定this值的函数，并作为数组（或类似数组的对象）提供。
3.常见问题
问题一：为什么要用call()和apply()方法？
问题二：call()和apply()两种方法的区别
4.解决方案
1.比如有段这样的函数：
function cat(){
}
cat.prototype={
food:"fish",
say: function(){
alert('I love '+this.food);
}
};
var blackCat = new cat;
blackCat.say();
var whiteDog = {food:'bone'};
blackCat.say.call(whiteDog);
我们有一个对象whiteDog = {food:”bone”},我们不想对它重新定义say方法,那么我们可以通过call或apply用blackCat的say方法：blackCat.say.call(whiteDog);
2.二者的区别
call与apply的区别 call, apply都属于Function.prototype的一个方法,它是JavaScript引擎内在实现的,因为属于Function.prototype,所以每个Function对象实例,也就是每个方法都有call, apply属性.既然作为方法的属性,那它们的使用就当然是针对方法的了.这两个方法是容易混淆的,因为它们的作用一样,只是使用方式不同.
相同点:两个方法产生的作用是完全一样的
不同点:方法传递的参数不同
call()接受的是一个参数列表，而apply()接受一个参数数组。 func.call(this, arg1, arg2); func.apply(this, [arg1, arg2]) 其中 this 是你想指定的上下文，他可以是任何一个 JavaScript 对象(JavaScript 中一切皆对象)，call 需要把参数按顺序传递进去，而 apply 则是把参数放在数组里。因此要说适用条件的话，当你的参数是明确知道数量时用 call 。 而不确定的时候用 apply，然后把参数 push 进数组传递进去。
举个小栗子来区别call和apply
获取数组中的最大值和最小值
var numbers = [5, 458 , 120 , -215 ];
var maxInNumbers = Math.max.apply(Math, numbers), //458
maxInNumbers = Math.max.call(Math,5, 458 , 120 , -215); //458
5.编码实战
6.扩展思考
还有哪些和call，apply类似的方法
bind() 方法
bind() 方法与 apply 和 call 很相似，也是可以改变函数体内 this 的指向。 bind()方法会创建一个新函数，称为绑定函数，当调用这个绑定函数时，绑定函数会以创建它时传入 bind()方法的第一个参数作为 this，传入 bind() 方法的第二个以及以后的参数，加上绑定函数运行时本身的参数，按照顺序作为原函数的参数来调用原函数。 也就是说，区别是，当你希望改变上下文环境之后并非立即执行，而是回调执行的时候，使用 bind() 方法。而 apply/call 则会立即执行函数。
7.参考文献
参考一：【优雅代码】深入浅出 妙用Javascript中apply、call、bind
参考二：js中bind、call、apply函数的用法
8.更多讨论
1.朱芳山：如果不用this还能不能使用call方法
分享人：做过demo，不用this，引用call等方法是无法借用函数
2.庄引：ES6中还有类似的替代方法吗？
龚家豪：createClass（）
3.龚家豪：实际的应用场景
分享人：需要配合this方法使用
更多内容，可以加入IT交流群565734203与大家一起讨论交流
这里是技能树·IT修真院：https://www.jnshu.com，初学者转行到互联网的聚集地
网友评论