Daily-Question icon indicating copy to clipboard operation
Daily-Question copied to clipboard

【Q032】js 中什么是 softbind,如何实现

Open shfshanyue opened this issue 4 years ago • 5 comments

相关问题:

shfshanyue avatar Nov 15 '19 11:11 shfshanyue

bind函数多次调用会已第一次绑定的this为准,softbind已最后一次绑定传入的this为准;

newwangyiyang avatar Dec 21 '20 03:12 newwangyiyang

  Function.prototype.softBind = function(obj, ...rest) {
    const fn = this
    const bound = function(...args) {
      const o = !this || this === (window || global) ? obj : this
      return fn.apply(o, [...rest, ...args])
    }

    bound.prototype = Object.create(fn.prototype)
    return bound
  }

function foo() { console.log(name: ${this.name}); }

let obj = {name: "obj"};
obj2 = {name: "obj2"};
obj3 = {name: "obj3"};

let fooBJ = foo.softBind(obj);
fooBJ();  // name: obj   这个时候软绑定已经生效了,this绑定到obj上
obj2.foo = foo.softBind(obj);
obj2.foo(); //name: obj2   这里已经的this隐式绑定到obj2上了
fooBJ.call(obj3); // name: obj3  这里this被硬绑定到obj3上了
setTimeout(obj2.foo, 100); // name: obj  软绑定了最初的obj

miaooow avatar Jan 05 '21 09:01 miaooow

TODO

shfshanyue avatar Jul 30 '21 08:07 shfshanyue

bound.prototype = Object.create(fn.prototype); 为什么要有这一句,不是很懂

shuangcherry avatar Jul 20 '22 02:07 shuangcherry

  Function.prototype.softBind = function (obj, ...args) {
     const fn = this;
     return function (...args2) {
        return fn.apply(this === global ? obj : this, args.concat(args2));
     };
  };

shen076 avatar Sep 06 '22 03:09 shen076

Function.prototype.softBind = function (ctx) {
    ctx ??= globalThis
    ctx = Object(ctx)

    const self = this
    const args = [...arguments].slice(1)

    function bound() {
        fn.call(new.target || this !== globalThis ? this : ctx, ...args)
    }

    bound.prototype = self.prototype
    return bound
}

zhangtuo1999 avatar Jan 27 '23 17:01 zhangtuo1999

bound.prototype = Object.create(fn.prototype); 为什么要有这一句,不是很懂 是要考虑到new的情况来着

rujptw avatar Mar 13 '23 03:03 rujptw

实现一个Bind:

function person(a, b, c, d, e) {
    console.log(this.name, a + b + c);
    console.log(d,e);
}

const yeti = {
    name: 'yeti'
}

// 实现一个bind
Function.prototype.newmyBind = function (obj, ...args) {
    const that = this
    return function (...rest) {  //返回一个修改好this的函数
        // ...rest来自返回函数传入的参数  ...args是调用Bind时传入的参数
        that.call(obj, ...args, ...rest)
    }

}

const resBind = person.newmyBind(yeti, 1, 2, 6) //1 2 6 就是...args
resBind(5, 6)   //传入...rest

Yeti-xxx avatar Mar 25 '23 03:03 Yeti-xxx