Skip to content

方法 执行时机 this 指向 参数传递方式 call() 立即执行 第一个参数 后续参数逐个传入,用逗号隔开 (fn.call(this, arg1, arg2)) apply() 立即执行 第一个参数 第二个参数是一个数组 (fn.apply(this, [arg1, arg2])) bind() 返回新函数 第一个参数 后续参数逐个传入(可预设参数),返回一个绑定好的新函数

区别就是call的参数是逐个传入的,apply用的都是数组,bind返回一个新函数,可以预设参数。

设计的结果就是,this直接指向外层函数,跟使用箭头函数的结果等价。

js
outerMethod: function() {
  console.log('外部方法的 this:', this.name); // this 是 myObject

  const innerArrowFunction = () => {
    // 这里的 this 就是 outerMethod 的 this
    console.log('箭头函数的 this:', this.name); 
  };
  
  innerArrowFunction();
}
// 输出: 箭头函数的 this: 外部对象

对于普通函数,this 的指向只取决于其“直接调用者”,如果不存在直接调用者,this 就会退回到全局对象或 undefined。它不会从定义它的外层函数那里“继承” this。

实现bind,主要是返回一个持久化的函数,一般是class组件里面用的多。

js
Function.prototype.myBind = function(context, ...bindArgs) {
  // context是待绑定的this
  context = context || window;

  // this 指向调用 myBind 的函数 (e.g., sayHello.myBind(...))
  const self = this;

  return function(...callbackArgs){

    const finalArgs = [...callbackArgs, ...bindArgs];

    return self.apply(context, finalArgs);
  }
}
本站访客数 人次 本站总访问量