原生js 实现 apply, call , bind 进行this的绑定

apply



// 实现
Function.prototype.myApply = function(context=globalThis,...args){

  let key = Symbol('key');
  context[key] = this;
  let result = context[key](args);
  delete context[key];
  return result;
}

function f(a,b){
  console.log(a+b)
  console.log(this.name)
 }

 let obj={
  name:'张三'
 }
 f.myApply(obj,[1,2])

call



Function.prototype.newCall = function(context=globalThis,...args) {

  let key = Symbol('key')
  context[key] = this
  let result = context[key](...args)
  delete context[key]
  return result;  
}
function f(a,b){
  console.log(a+b)
  console.log(this.name)
 }

 let obj={
  name:1
 }
 f.newCall(obj,1,2)

bind

Function.prototype.myBind = function (context, ...outerArgs) {
  // this->func context->obj outerArgs->[10,20]
  let self = this

  // 返回一个函数
  return function F(...innerArgs) { //返回了一个函数,...innerArgs为实际调用时传入的参数
    // 考虑new的方式
    if(self instanceof F) {
      return new self(...outerArgs, ...innerArgs)
    }
    // 把func执行,并且改变this即可
    return self.apply(context, [...outerArgs, ...innerArgs]) //返回改变了this的函数,参数合并
  }
}

版权声明:本文为weixin_45644335原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明。