手写JavaScript中的bind方法

之前已经实现过了call，apply和new。今天顺便把bind也实现下。
首先：

1. bind方法返回的是一个绑定this后的函数，并且该函数并没有执行，需要手动去调用。(从这一点看bind函数就是一个高阶函数，而且和call，apply方法有区别)。
2. bind方法可以绑定this，传递参数。注意，这个参数可以分多次传递。
3. 如果bind绑定后的函数被new了，那么此时this指向就发生改变。此时的this就是当前函数的实例。
4. 构造函数上的属性和方法，每个实例上都有。

ok，上代码～

Function.prototype.mybind = function(context){
    let that = this;
    let args1 = Array.prototype.slice.call(arguments,1);
    let bindFn = function(){
        let args2 = Array.prototype.slice.call(arguments);
        return that.apply(this instanceof bindFn?this:context,args1.concat(args2)); 
    }
    let Fn = function(){};
    Fn.prototype = this.prototype;
    bindFn.prototype = new Fn();
    return bindFn;
}

首先 获取到第一次传递的参数args1，此处要做截取处理，因为第一个参数是this。接下来声明一个函数bindFn，在该bindFn中获取了第二次传的参数args2，并且返回了that的执行。此处的that就是原函数，执行该原函数绑定原函数this的时候要注意判断。如果this是构造函数bindFn new出来的实例，那么此处的this一定是该实例本身。反之，则是bind方法传递的this(context)。最后再把两次获得的参数通过concat()连接起来传递进去，这样就实现了前3条。
最后一条：构造函数上的属性和方法，每个实例上都有。 此处通过一个中间函数Fn，来连接原型链。Fn的prototype等于this的prototype。Fn和this指向同一个原型对象。bindFn的prototype又等于Fn的实例。Fn的实例的__proto__又指向Fn的prototype。即bindFn的prototype指向和this的prototype一样，指向同一个原型对象。至此，就实现了自己的bind方法。
代码写好了， 测试一下吧~

Function.prototype.mybind = function(context){
    let that = this;
    let args1 = Array.prototype.slice.call(arguments,1);
    let bindFn = function(){
        let args2 = Array.prototype.slice.call(arguments);
        return that.apply(this instanceof bindFn?this:context,args1.concat(args2)); 
    }
    let Fn = function(){};
    Fn.prototype = this.prototype;
    bindFn.prototype = new Fn();
    return bindFn;
}

let obj = {
    name:'tiger'
}

function fn(name,age){
    this.say = '汪汪~';
    console.log(this);
    console.log(this.name+'养了一只'+name+','+age+'岁了 ');
}

/** 第一次传参 */
let bindFn = fn.mybind(obj,'🐶');
/** 第二次传参 */
bindFn('10');

/* 构造函数上的属性和方法，每个实例上都有 */
let instance = new bindFn('20');
bindFn.prototype.type = '哺乳类';
console.log(instance.type);

分别在执行mybind()和执行mybind后函数的时候，传递了两次参数。并且打印了：

tiger养了一只🐶,10岁了 

可以看到，实现了分两步传参数。
其次，通过new 得到了构造函数bindFn的实例instance。在构造函数bindFn上拓展属性type等于'哺乳类'。打印该构造函数的实例instance，可以看到打印出了：哺乳类。
至此，证明了手写的bind方法符合所有预期需求。喜欢点个👍，thx～