js中的call方法源码解析

call（）方法的作用是改变函数里的this指向。

例如：

function func(){
console.log(this.name)
}
var a ={
  name : 'dudu'
}

func.call(a)//this指向对象 a
此时输出 //dudu

再看下面的代码 

//1
var a = {
  name : 'dudu',
  fn   :  func
}

//2
a.func() // 输出dudu

//3

delete a.fn //

call最终目的相当于把函数func添加到对象a中然后执行func 最后删除这个属性

模拟call的源码：

Function.prototype.call = function(ctx){
var ctx = ctx || window //判断是否有参数 如果没有 赋予全局作用域

ctx.fn = this //this是Function 的实例对象即是调用者本身
var array = [] //储存参数
for (i=1; i < arguments.length; i++){
array.push('arguments[' + i + ']')
}
//此处运用es6的语法
var result = ctx.fn(...array)

//es3的方法  var reslut = eval('ctx.fn(' + array + ')')  严格模式下不允许使用eval方法。
delete ctx.fn

return result
}

此时思考一下这个问题  

function fn1(){

  console.log('fn1')

}

function fn2(){

  console.log('fn2')

}

fn1.call(fn2) // 此时输出显而易见的 fn1


fn1.call.call(fn2)// 此时打印的是什么那 fn1 ? fn2 ? 
 //答案是fn2

看上面的源码可以吧fn1.call 看成一个整体 fn3,即fn3.call(fn2) 此时执行fn3（），但是fn3函数里的this是指向fn2；所以执行

fn1.call() //此时this 指向fn2 故输出的结果是fn2