自定义call&apply&bind的实现

仿造原生js的call,apply,bind的原理自定义绑定this的工具函数

实现思路：大致是改变函数执行环境中this的指向，这个this的指向根据谁调用了这个函数来决定，如果将这个函数成为某个对象方法，this就和这个对象进行了绑定。

注意：在自定义的函数中记得返回被调用的函数（this发生改变）其返回值，如果传入的对象是null或者undefined，则被调用的函数this指向window。

代码实现：

function Call (Fn,obj,...argument) {

 // 如果obj是null或者undefined，Fn的this指向window，所以由window来调用

 if (obj === undefined || obj === null) {

 obj = window

 }

 // 1.给obj添加一个属性，值为Fn，目的是改变this指向

 obj.tempFun = Fn

 // 2.调用该函数，改变执行环境中this的指向

 let result = obj.tempFun(...argument)

 // 3.删除obj添加的方法

 delete obj.tempFun

 // 4.返回函数执行的返回值

 return result

 }

 function Apply (Fn,obj,argument) {

 // 两者只是传参的形式不同，在函数体里调用自定义的Call函数，参数解构赋值即可

 return Call(Fn,obj,...argument)

 }

 function Bind (Fn,obj,...argument) {

 return function(...argument2) {

 Call(Fn,obj,...argument,...argument2)

  }

 }

验证结果：

function fn (a,b) {

 console.log(a,b,this)

 }

 let person = {name:'zhangsan',age: 10}

 fn(1,2)

 Call(fn,person,1,2)

 Call(fn,undefined,1,2)

 Apply(fn,person,[1,2])

 Apply(fn,null,[1,2])

 let bindFun = Bind(fn,person)

 bindFun(3,4)