call和apply和bind

var foo = {
    value: 1
};
function bar() {
    console.log(this.value);
}
bar.call(foo); // 1

var foo = {
    value: 1,
    bar: function() {
        console.log(this.value)
    }
};
foo.bar(); // 1

Function.prototype.myCall = function (context) {
  var context  = context || window
  var context.fn = this // 这个this就是我们使用call的时候前面的函数，相当于上面的对象里面的bar函数
  var arg = [].slice.call(arguments, 1) // 获取context后面的所有参数
  var result = context.fn(...arg)
  delete context.fn
  return result
}
// 使用
var name = 'window'
var obj = {
  name: 'chenji'
}
function test () {
 var name = 'test'
 console.log(this.name)
}
test() //outPut  'window'
test.call(obj, 12) // outPut  'chenji'

Function.prototype.myApply = function (context) {
  var context  = context || window
  var context.fn = this // 这个this就是我们使用call的时候前面的函数，相当于上面的对象里面的bar函数
  var result
  // 判断是否有传入第二个参数，apply的第二个参数是数组，有的话就展开
  if (arguments[1]) {
     result = context.fn(..arguments[1])
  } else {
     result = context.fn()
  }
  delete context.fn
  return result
}
// 使用
var name = 'window'
var obj = {
  name: 'chenji'
}
function test () {
 var name = 'test'
 console.log(this.name)
}
test() //outPut  'window'
test.call(obj, 12) // outPut  'chenji'

 var foo = {
    value: 1
};
function bar(name, age) {
    console.log(this.value);
    console.log(name);
    console.log(age);

}
var bindFoo = bar.bind(foo, 'daisy');
bindFoo('18'); 
// 1
// daisy
// 18

Function.prototype.bind2=function(context){
   if (typeof this !== "function") {
     throw new Error("Function.prototype.bind - what is trying to be bound is not callable");
   }
   var self=this;
   var arr=Array.prototype.slice.call(arguments,1);//因为第一个参数是作为它运行时的this，所以从第二个开始截取到末尾
   return function(){
       var binArr=Array.prototype.slice.call(arguments);// 这个时候的arguments是指bind返回的函数传入的参数
       return self.apply(context,arr.concat(binArr));
   }
}

var value = 2;
var foo = {
  value: 1
};
function bar(name, age) {
    this.habit = 'shopping';
    console.log(this.value);
    console.log(name);
    console.log(age);
}

bar.prototype.friend = 'kevin';
var bindFoo = bar.bind(foo, 'daisy');
var obj = new bindFoo('18');
// undefined
// daisy
// 18
console.log(obj.habit);
console.log(obj.friend);
// shopping
// kevin

Function.prototype.myBind = function (context) {
  if(typeof this !== 'Function'){
    throw new Error("this is a function");
  }
  var _this = this
  var arg = [].slice.call(arguments,1)
  return function F () {
    // 因为bind返回了一个函数，所以有可能使用new F(),就如上面的例子，所以需要通过以下这个来判断是否被实例化过，是的话就返回一个原函数的实例化对象来改变this的指向
    if (this instanceof F) {
      return new _this(...arg, ...arguments)
    }
    return _this.apply(context, arg.concat(...arguments))
  }
}