实现call、apply、bind函数

  • call和apply方法使用时的调用对象为一个方法,call函数和apply方法可改变调用者的this,处理方式相同。
  • bind方法和call、apply一样改变调用者的this,只是该调用者还未执行,返回一个函数。该函数用new操作符调用时需注意两点:
  • new操作时new的优先级大于context,需处理判断this指针
  • bind中返回函数的原型是调用bind方法的调用者原型的一个实例

1、call函数

Function.prototype.myCall = function(context) {
    if (typeof this !== 'function') {
        return;
    }//判断调用者是一个方法
    context=context||window ;//判定第一个参数,没有则为window
    context.fn = this;//定义context上的一个属性,赋值为调用myCall函数的那个函数,改变this指针的关键一步
    const args = [...arguments].slice(1);//处理参数
    const result = context.fn(...args);//执行函数 当前this为context
    delete context.fn;//删除该函数 释放内存
    return result;//返回该函数的结果
}

2、apply函数

Function.prototype.myApply = function(context) {
    if (typeof this !== 'function') {
        return;
    }
    context = context || window;
    context.fn = this;
    let result;
    if (arguments[1]) {
        result = context.fn(...arguments[1]);
    } else {
        result = context.fn();
    }
    delete context.fn;
    return result;
}

3、bind函数

Function.prototype.myBind = function(context) {
    if (typeof this !== 'function') {
       return;
    }
    const that = this;//返回一个绑定this的函数,这里我们需要保存this
    const args = [...arguments].slice(1);//参数处理
    var F = function(){
        var _this=this instanceof that?this:context//确定this,new操作的优先级大于context
        return that.apply(_this, args.concat(...arguments))
    }
    F.prototype = Object.create(this.prototype);//F.prototype是this.prototype的一个实例
    return F;
}

你可能感兴趣的:(实现call、apply、bind函数)