深刻JavaScript之call和apply方法

难兄难弟

我是js里的call方法，我和apply方法是难兄难弟。为何这么说呢，由于不少前端小白看到咱俩就犯怵: "WTF！这是什么方法，根本看不懂啊！"而后去谷歌去百度，回来仍是："WTF！仍是没懂！"。而后就把咱俩丢在一边无论了，心想："哎，能不用就不用吧，反正也不见得用得着"。

借过来玩一玩

其实只要你认真的研究一下， 就会发现我和我哥们一点也不难。有些地方没有咱俩还真不行。要说咱俩有啥用，我管咱俩的功能叫借过来玩一玩。你看下面的例子啊：

let cat = {
    food: 'fish'，
    eat: function() {
        console.log('I want to eat ' + this.food);
    },
   sleep: function(time) {
      console.log('I sleep' + time);
   }
}
let dog = {
    food: 'bone'，
    playBall: function() {
        console.log('I am a doggy, I love playing ball');
    }
}
dog.playBall();    //I am a doggy, I love playing ball
cat.eat();    //I want to eat fish
cat.eat.call(dog);   //I want to eat bone

喵星人那里定义了eat方法，而汪星人里边只定义了playBall方法，懒惰的汪星人不想在本身内部再定义一个重复的eat方法，可是又想吃吃吃，那怎么办呢？
固然就是经过我call方法来找喵星人把eat方法借过来玩一玩啦。因此呢：
cat.eat.call(dog);的意思就是：喵哥！你的eat方法借dog玩一玩呗！你那个eat方法里的this如今指向了dog了啊！
这下你明白了为啥个人功能是借过来玩一玩了吧：
1.没有的方法我去别人那里借。
2.我能够改变被调用方法内部的this指向, this指向第一个参数。

除此以外，你可能会问了，假如我要调用的函数要接收参数，要怎么办呢？那么能够用到我call方法接收的第2,3,4...个参数了！

cat.sleep.call(dog, 'all day'); //I sleep all day

我和我哥们apply的区别

我和我哥们apply区别很小很小，由于咱俩的主要功能都是同样的，都是借方法过来玩一玩外加改变this的指向，咱俩惟一的不一样在于：
对于要借过来玩一玩的函数：

function myFunction(arg1, arg2, arg3, arg4) {
    console.log(arg1);
    console.log(arg2);
    console.log(arg3);
    console.log(arg4);
}

我call的使用方法是myFunction.call(null, '1', '2', '3', '4')
而apply的使用方法是myFunction.apply(null, ['1', '2', '3', '4'])
看出来了么，apply这哥们有强迫症！他要把传进去的参数用数组包起来！而我就是一个一个往里传。你要是怕记混咱俩，你就这么记： 我是call，call就是打电话啊，打电话不得一个一个打吗，因此个人参数是一个个独立的。

这区别有啥用啊？

你可能又要问了：既然你俩区别这么小，并且看你上面的例子，既能用call又能用apply，那你俩这区别有啥用啊？
嘿嘿嘿，固然有用啦，看我给你举个栗子啊：

//这个函数熟悉吧？求传入参数的最大值
Math.max(1, 2, 3); //3

若是你是想求一个数组中的最大值， 咋办？把数组传入Math.max?固然不行，不信的话你能够试一下。这个时候我call方法就无能为力了，只能让apply帮你了:

let myArray = [1, 2, 3];
Math.max.apply(null, myArray);

ps: 也可使用...运算符Math.max(...myArray);

最后

咱们这对难兄难弟其实一点也不难啊！(╯﹏╰)