自定义实现JS中的bind方法

bind方法要实现什么功能?

  • bind()方法用于将函数体内的this绑定到某个对象,然后返回一个新函数。
  • bind()方法的第一个参数就是所要绑定this的对象,后边可以接收更多的参数。
  • bind()方法返回的新函数也可以接收参数。

方式1

function myBind(fn, newThis, ...arg1) {
    
    
  return function (...arg2) {
    
    
    let args = arg1.concat(arg2);
    return fn.apply(newThis, args); // 注意要 return 一下,因为原来的那个函数可能有返回值
  }
}

// 测试
function demo(...args) {
    
    
  console.log(args);
  console.log(this.color);
}

let obj = {
    
    
  color: 'red'
};

let newDemo = myBind(demo, obj, 1, 2);
newDemo(5, 6);
// [1, 2, 5, 6]
// "red"

方式2

Function.prototype.myBind = function (newThis,...arg1) {
    
    
  let that = this;  // 这里的 this指向当前调用 myBind方法的函数
  return function (...arg2) {
    
    
    let args = [...arg1,...arg2];
    return that.apply(newThis,args);
  }
};

// 测试
function add(x, y) {
    
    
  return x * this.m + y * this.n;
}

let obj2 = {
    
    
  m:2,
  n:3
};

let newAdd = add.myBind(obj2,5);
console.log(newAdd(2)); // 16

前端学习交流QQ群,群内学习讨论的氛围很好,大佬云集,期待您的加入:862748629 点击加入

猜你喜欢

转载自blog.csdn.net/weixin_43974265/article/details/115478364
今日推荐