JavaScript的call、apply

call和apply是函数的方法。只要是函数都具有这两个方法。
在javascript OOP中，我们经常会这样定义：

 function cat（）{ } cat.prototype={     food:"fish",          say: function(){alert("I love "+this.food);} } var blackCat = new cat（）; blackCat.say（）; 

但是如果我们有一个对象whiteDog = {food:”bone”},我们不想对它重新定义say方法，那么我们可以通过call或apply用blackCat的say方法：blackCat.say.call(whiteDog);
所以，可以看出call和apply是为了动态改变this而出现的，当一个object没有某个方法，但是其他的有，我们可以借助call或apply用其它对象的方法来操作。
用的比较多的，通过document.getElementsByTagName选择的dom 节点是一种类似array的array。它不能应用Array下的push,pop等方法。我们可以通过：

var domNodes =  Array.prototype.slice.call(document.getElementsByTagName("*"));

所以call 和 apply 都是为了改变某个函数运行时的 context（即上下文）而存在的，换句话说，就是为了改变函数体内部 this 的指向。因为 JavaScript 的函数存在「定义时上下文」和「运行时上下文」以及「上下文是可以改变的」这样的概念。this的指向在函数定义的时候是确定不了的，只有函数执行的时候才能确定this到底指向谁，实际上this的最终指向的是那个调用它的对象。
call和apply二者的作用完全一样，只是接受参数的方式不太一样，call 需要把参数按顺序传递进去，而 apply 则是把参数放在数组里。JavaScript 中，某个函数的参数数量是不固定的，因此要说适用条件的话，当你的参数是明确知道数量时，用 call，而不确定的时候，用 apply，然后把参数 push 进数组传递进去。当参数数量不确定时，函数内部也可以通过 arguments 这个数组来便利所有的参数。
为了方便记忆：

猫吃鱼，狗吃肉，奥特曼打小怪兽。有天狗想吃鱼了猫.吃鱼.call(狗，鱼)狗就吃到鱼了猫成精了，想打怪兽奥特曼.打小怪兽.call(猫，小怪兽)

就这样记住了。
接下来再用一些例子来说明：

var a = {    user:"xxx",    fn:function(){        console.log(this.user);    }}a.fn(); //xxx

a对象的fn属性为一个函数，a.fn( )就是在执行函数，函数执行时，函数体中的this指向函数的调用者即a，打印a的user属性值，a的user属性值为xxx，所以打印xxx。
如果写成如下形式：

var a = {    user:"xxx",    fn:function(){        console.log(this.user);    }}var b = a.fn;b(); //undefined

这里b函数的调用者为window，所以函数中的this指向了window，而window中并没有user属性，所以执行b函数得到的是undefined。
利用已经知道的apply call的用法，可以将代码写成如下格式：

var a = {    user:"xxx",    fn:function(){        console.log(this.user);     }}var b = a.fn;b.call(a);//xxx

这里还是在执行b函数，只不过b函数中的this被指向了a对象，所以函数体中打印的就是a对象的user属性值，所以可以正常打印出xxx。
而如果将代码改写为如下格式：

var a = {    user:"xxx",    fn:function(){        console.log(this.user);     }}var b = a.fn;b.call(null);//undefined

用null替换了a，就相当于传入了window对象（非严格模式下），那么执行b函数的时候，this指向了window，window没有user属性，因此打印undefined。
接下来为函数加上一些参数：

var a = {    user:"xxx",    fn:function(arg1,arg2){        console.log(this.user);         console.log(arg1+arg2);     }}var b = a.fn;var args = [10,1];b.apply(a,args);//或b.apply(a,[10,1]) 或b.call(a,10,1)

以上执行的结果就是控制台上输出xxx，并输出11。
与call和apply相类似的还有一个bind方法。bind方法也可以用来改变this的指向，不同之处在于call和apply都是改变上下文中的this并立即执行这个函数，bind方法可以返回一个被改变了this的函数，并且让这个改变后的函数按需调用。如果需要传入参数可以在调用bind方法时传入，也可以在函数调用时再传入。
代码示例：

var a = {    user:"xxx",    fn:function(){        console.log(this.user);    }}var b = a.fn;b.bind(a);

这段代码写完后控制台并不会输出xxx。这是因为b.bind(a)只会返回一个新的函数。即：

var a = {    user:"xxx",    fn:function(){        console.log(this.user);    }}var b = a.fn;var c = b.bind(a);c();

c为b.bind(a)返回的，已经改变了this指向的函数。因此虽然c函数的调用者是window对象，但是控制台上可以正常输出xxx而不是undefined。
如果有参数：

var a = {    user:"xxx",    fn:function(arg1,arg2){        console.log(this.user);        console.log(arg1+arg2);    }}var b = a.fn;var c = b.bind(a);c(10,1);

可以在c函数调用的时候，将需要的参数传入。当然，也可以写成这样：

var a = {    user:"xxx",    fn:function(arg1,arg2){        console.log(this.user);        console.log(arg1+arg2);    }}var b = a.fn;var c = b.bind(a,10,1);c();

或：

var a = {    user:"xxx",    fn:function(arg1,arg2){        console.log(this.user);        console.log(arg1+arg2);    }}var b = a.fn;var c = b.bind(a,10);c(1);

可见，传递参数的方式是比较灵活的。
本文参考资料：
来自追梦子的博客：JavaScript中call,apply,bind方法的总结
来自知乎的问答：如何理解和熟练运用js中的call及apply？