实现call、apply、bind
一、实现myCall
首先,call函数是将this绑定到传入的第一个参数上,其余参数作为调用函数的参数。
func.call(thisArg, arg1, arg2, ...);
那么,分为三步:
- 将 this 赋值给 thisArg ,作为它的某个函数属性
- 调用这个函数属性
- 删除这个属性
方法一:采用数组扩展符
Function.prototype.myCall = function (thisArg, ...arguments) {
const func = Symbol();
thisArg[func] = this;
const res = thisArg[func](...arguments);
delete thisArg[func];
return res;
}
方法二:采用eval执行
Function.prototype.myCall = function (context) {
var thisArg = context[0];
thisArg.fn = this;
var evalStr = 'thisArg.fn(';
for (var i = 1; i < context.length; i++) {
if (typeof context[i] === 'string') {
evalStr += `"${context[i]}",`; // 对字符串情况的处理
} else {
evalStr += `${context[i]},`;
}
}
var res = eval(evalStr);
delete thisArg.fn;
return res;
}
二、实现myApply
同myCall,只是参数需以数组的形式。
这里只写一种方法,另一种类似 call。
Function.prototype.myApply = function(thisArg, argArray) {
const fn = Symbol();
thisArg[fn] = this;
const res = thisArg[fn](...argArray);
delete thisArg[fn];
return res;
}
三、实现myBind
bind函数返回一个新的函数,例如:
const fun2 = fun1.bind(obj, arg1, arg2);
fun2(arg3, arg4);
// 相当于
fun1.call(obj, arg1, arg2, arg3, arg4);
那么,可以写出:
Function.prototype.myBind = function(thisArg, ...argArray) {
const self = this; // 这里先将此刻的this暂存起来
return function(...argArray2) {
const func = Symbol();
thisArg[func] = self;
const res = thisArg[func](...argArray, ...argArray2);
delete thisArg[func];
return res;
}
}
这里只写一种方法,另一种类似 call。