call 这货到底是什么

1、call有两个妙用：

  1: 继承。(不太喜欢这种继承方式。)
  2: 修改函数运行时的this指针。

这里引用《javascript权威指南》对call的描述

image.png

注意红色框中的部分，f.call(o)其原理就是先通过 o.m = f 将 f作为o的某个临时属性m存储，然后执行m，执行完毕后将m属性删除。

    function f() {

        var a = "name";

        this.b = "test1";

        this.add = function() {
            return "add"
        }

    }

    function o() {

        this.c = "c";

    }

f.call(o) 其实相当于：
    function o() {

        this.c = "c";

        var a = "name";

        this.b = "test1";

        this.add = function() {
            return "add"
        }

    }

说白了，就是把f的方法在o中走一遍，但不做保存。既然不做保存，那么如何通过call实现继承和修改函数运行时的this指针等妙用？关键在于this，对，关键还是在于this的作用域。在之前的文章反复说过，this的作用域不是定义它的函数的作用域，而是执行时的作用域。

image.png

第一个中直接调用fn方法，其中因为没有定义函数作用域，输出的this表示window对象，即全局对象。而第二个中通过fn.call(array[index] , index , array[index] )将fn方法放到array[index]作用域中执行，输出的this表示的是array[index]对象。

//实现each方法封装
var each = function(arr,fn) {
    for (var i=0; i<arr.length; i++){
        fn.call(arr[i],i,arr[i]);
    }

}
each([1,2,3,4],function(i,item){
    console.log(this) //当前this指向arr[i]
    console.log(i)    //上面传的第一个参数i
    console.log(item) //上面传的二个参数arr[i] 这里主要说明call的传参方式
})