call, apply, bind的分析与实现

1、call, apply, bind的分析与实现如何转变函数的this指向 假如是函数声明，那么函数内部的this指向全局对象或者调用该函数的对象。 箭头函数的this绑定的是父级作用域内的this 用法call，apply，bind可以绑定this指向。其中bind是永远转变this指向并且不会立刻执行。apply，call暂时转变this指向并且立刻执行。 apply，call不同之处在于调用的参数形式： call（thisarg, arg1?, arg2?, arg3?）第一个参数代表this指向，剩下的参数就是原函数的参数。 apply（thisarg, argarray?）第一个参数代

2、表this指向，其次个参数是以数组的形式传递参数。 /* bind, call, apply调用示例 */ var obj = x: &39;obj&39;, getx: function（） / 注重这里不能用法箭头函数 return this.x; ; / 调用 obj 对象上的函数属性， this就会绑定为obj / &39;obj&39; console.log（obj.getx（）; var x = &39;window&39; function target（a, b, c） console.log（a, b, c）; return this.x; /* bind */ / und

3、efined undefined undefined / &39;window&39; console.log（target（）; const targetbound = target.bind（obj, 1）; / 此时targetbound就是一个转变了this指向的target / 1 2 3 / &39;obj&39; console.log（targetbound（2, 3）; /* call */ / 4 5 6 / &39;obj&39; console.log（target.call（obj, 4, 5, 6）; /* apply */ / 7 8 9 / &39;obj&39

4、; console.log（target.apply（obj, 7, 8, 9）; 自定义实现call，apply，bind 这三个函数都有很强的错误处理功能，如果传入的thisarg是一个基本类型，也会被用法包装类替换，虽然不会报错，但是不推举这样写，尽量传递复杂类型的变量作为thisarg。 自定义实现mybind，mycall，myapply / 先定义一个函数将随意类型都转换成对象，用于指向this function anytoobj（value） / symbol, bigint 就不推断了，挺直在default中 switch （typeof value） case &39;boo

5、lean&39;: return new boolean（value）; case &39;number&39;: return new number（value）; case &39;string&39;: return new string（value）; case &39;undefined&39;: return this; case &39;object&39;: if （value = null） return this; / 这里的this就指向了全局对象 return value; default: return value; /* mybind */ f

6、totype.mybind = function （thisarg, argarray） / 防止浮现 const mybind = ftotype.mybind; mybind（）; if （typeof this != &39;function&39;） throw new typeerror（&39;mybind must be called on a function&39;）; const that = this; / this 就指向 f.mybind（） 的 f const thatarg = anytoobj（thisarg）; / 处理一下thisarg

7、 const mybound = function （args） / 指定唯一的键 const tempkey = symbol（&39;_innerfunction_&39;）; thatarg.tempkey = that; / 将 that 函数赋值给一个对象的属性 let ret; if （this instanceof mybound） / 调用 mybind 之后返回的是 mybound，如果调用 new mybound（），就会进这个分支 ret = new thatarg.tempkey（argarray.concat（args）; else / 这里是调用 mybound（）

8、，这样调用 tempkey 办法里的 this 就指向了 thatarg ret = thatarg.tempkey（argarray.concat（args）; / 不会对对象造成污染 delete thatarg.tempkey; return ret; ; return mybound; ; /* mycall */ / 与 mybind 相比挺直调用了 ftotype.mycall = function （thisarg, argarray） if （typeof this != &39;function&39;） throw new typeerror（&39;

9、mycall must be called on a function&39;）; const thatarg = anytoobj（thisarg）; const tempkey = symbol（&39;_innerfunction_&39;）; thatarg.tempkey = this; const ret = thatarg.tempkey（argarray）; delete thatarg.tempkey; return ret; ; /* myapply */ / 与 mycall 相比，其次个参数希翼是数组形式，多了个 createlistfromarraylike 用于转化

10、 argarray ftotype.myapply = function （thisarg, argarray） if （typeof this != &39;function&39;） throw new typeerror（&39;myapply must be called on a function&39;）; const createlistfromarraylike = function （val） / 同样缺乏 bigint 的处理，挺直放在 default 中 switch （typeof val） case &39;string&39;: case &3

11、9;number&39;: case &39;boolean&39;: case &39;symbol&39;: throw new typeerror（&39;createlistfromarraylike called on non-object&39;）; case &39;object&39;: if （array.isarray（val） return val; if （val = null） return ; return array.from（val）; default: return ; ; / 检测 argarray 的类型 const tempargarray = crea

12、telistfromarraylike（argarray）; const thatarg = anytoobj（thisarg）; const tempkey = symbol（&39;_innerfunction_&39;）; thatarg.tempkey = this; const ret = thatarg.tempkey（tempargarray）; delete thatarg.tempkey; return ret; ; / 这样 mybind，mycall，myapply就完成了，下面举行测试 var obj = x: &39;obj&39;, getx: function（a

13、, b, c） console.log（a, b, c）; return this.x; var x = &39;window&39; / 1 2 3 / &39;obj&39; console.log（obj.getx（1, 2, 3）; / target变成一个全局函数，this 指向全局对象 const target = obj.getx; / 1 2 3 / &39;window&39; console.log（target（1, 2, 3）; /* mybind */ const targetbound = target.mybind（obj, 1）; / 1 2 3 / &39;obj&39; console.log（targetbound（2, 3）; /* mycall */