bind apply call的区别及实现

参见https://blog.csdn.net/qq_40479190/article/details/78324270

https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Function/bind

http://www.ecma-international.org/ecma-262/6.0/ECMA-262.pdf

apply call bind 都是改变函数调用时this指向,apply call 会立即执行该函数,bind是返回绑定this指向后的函数,apply和call的区别是传入参数格式不同,apply接收数组,call接收参数列,实现apply 和call 方法

Function.prototype.call1 = function(obj,...rest){
     var self = this; //this即调用call方法的函数对象
     var context = Object(obj) || window
     context.fn = this
     return context.fn(...rest)
     //delete context.fn 
}

Function.prototype.call2 = function(obj){
     var self = this; //this即调用call方法的函数对象
     var context = Object(obj) || window
     context.fn = this
     var args = [];
     for(var i=1;i

bind会创建一个新的函数,新函数的this被bind 的第一个参数指定,其余参数作为新函数调用时使用;

bind第一个参数:

1.调用bind函数时作为this参数传递给目标函数,如果对新函数使用new运算符,则忽略该值;

2.当使用bind在setTimeout中创建一个函数时,bind的第一个参数若为原始值,都将转换为Object;(在条件下原始只都会被转成Object)

3.如果bind 函数参数列表为空,执行作用域的this将被视为新函数的this;

绑定函数也可以使用new运算符构造,它会表现为目标函数已经被构建完毕了似的。提供的this值会被忽略,但前置参数仍会提供给模拟函数。

返回原始函数的拷贝,并拥有指定的this和参数

应用场景  创建偏函数(即带有指定参数的函数);指定确定this的函数

用call apply实现bind 方法 from MDN polyfill

if (!Function.prototype.bind) {
  Function.prototype.bind = function(oThis) {
    if (typeof this !== 'function') {
      // closest thing possible to the ECMAScript 5
      // internal IsCallable function
      throw new TypeError('Function.prototype.bind - what is trying to be bound is not callable');
    }

    var aArgs   = Array.prototype.slice.call(arguments, 1),
        fToBind = this,
        fNOP    = function() {},
        fBound  = function() {
          // this instanceof fBound === true时,说明返回的fBound被当做new的构造函数调用
          return fToBind.apply(this instanceof fBound
                 ? this
                 : oThis,
                 // 获取调用时(fBound)的传参.bind 返回的函数入参往往是这么传递的
                 aArgs.concat(Array.prototype.slice.call(arguments)));
        };

    // 维护原型关系
    if (this.prototype) {
      // Function.prototype doesn't have a prototype property
      fNOP.prototype = this.prototype; 
    }
    // 下行的代码使fBound.prototype是fNOP的实例,因此
    // 返回的fBound若作为new的构造函数,new生成的新对象作为this传入fBound,新对象的__proto__就是fNOP的实例
    fBound.prototype = new fNOP();

    return fBound;
  };
}

 

你可能感兴趣的:(javaScript)