apply、call和bind的使用方法

初学JS的时候觉得this简直是难懂，看了书和无数篇别人的文章，也没能彻底弄清，现在觉得想要弄懂一个知识得靠不断地积累和反复的学习，而不是看了几篇“彻底弄清XX”之类的文章，这里我把困惑我一段时间的有关apply、call和bind的知识做一个总结，不敢打着“看完这个，就能彻底弄懂XX”的名头，但求做一个完整的理解记录，也希望能够帮助到看到这篇文章的朋友。

首先，这三种方法都是为了改变一个函数运行时的this指向存在的。可以用劫持来形容这种关系，指定一个对象来劫持另一个对象上的方法，并且改变方法运行时内部的this指向。

        var o={
            funName:"o name",
            fun:function(args){
                console.log(this.funName+args)
            }
        }
        //首先在对象o上调用fun方法
        o.fun(" args");//o name args
        var o_apply={
            funName:"apply name",
        }
        //调用对象o的fun方法，但是将this指向改为o_apply，funName自然指向o_apply内部的funName
        o.fun.apply(o_apply,[" args"])//apply name args
        var o_call={
            funName:"call name",
        }
        //原理同上，只是使用call方法的传参形式不同于apply
        o.fun.call(o_call," args");//call name args
        var o_bind={
            funName:"bind name",
        }
        //原理同上，只是使用bind方法的传参形式不同，并且需要手动再调用
        o.fun.bind(o_bind)(" args");//bind name args

apply和call

fun.apply(thisArg[, argsArray])

apply() 方法调用一个函数, 其具有一个指定的this值，以及作为一个数组（或类似数组的对象）提供的参数。
call()方法与apply用法基本相同，不同点在于传入参数，call接收若干个参数的列表。
使用call需要明确知道传入参数数量和名称，apply则不需要，push到一个数组传入即可。

apply的妙用：

求最大值：var array = [1,2,3];Math.max.apply(null,array); // 3
求最小值：var array = [1,2,3];Math.min.apply(null,array); // 1

这里的原理是Math求最值方法不接收数组，利用apply特性将数组转化为参数列表传入。

合并数组：var array1 = [1,2,3],array2 = [4,5,6];Array.prototype.push.apply(array1,array2);

但其实合并数组可以用concat，性能更好。

call用来转将类数组转为数组

类数组对象：只包含使用从零开始，且自然递增的整数做键名，并且定义了length表示元素个数的对象，类数组在读写操作上与数组像似，并且可以使用for循环进行遍历，但是没有数组的很多方法如pop（）等。
JS中常见的类数组有：arguments，DOM操作中获取的nodelist等。
借助call方法可以巧妙的将类数组转换为数组。

        function argsToArray(a,b){
            console.log(arguments);
            console.log(arguments instanceof Array);//false
            let arr=Array.prototype.slice.call(arguments,0);
            console.log(arr instanceof Array);//true
            console.log(arr);
        }
        argsToArray(1,2);

原理在于数组的slice方法可以返回一个数组。然后通过call改变slice方法中的this指向，使其为arguments对象，内部的方法构建一个新数组，并且循环arguments对象将其元素push近新数组，然后返回这个数组，就得到了一个内部元素与之前的arguments完全一样的但是性质上是一个真正数组的对象。

Array.prototype.slice = function(start,end){  
      var result = new Array();  
      start = start || 0;  
      end = end || this.length; 
      for(var i = start; i < end; i++){  
           result.push(this[i]);  
      }  
      return result;  
 } 

bind（）

bind（）创建一个新的函数, 当被调用时，将其this关键字设置为提供的值，在调用新函数时，在任何提供之前提供一个给定的参数序列。