zl程序教程

您现在的位置是:首页 >  Javascript

当前栏目

JavaScript深入之手写call、apply、bind

2023-02-18 16:30:12 时间

模拟实现call

  • 将函数设为对象的属性
  • 执行该函数
  • 删除该函数
Function.prototype.myCall = function(context = window, ...args) {
  if(this === Function.prototype) {
    return undefined 
  }
  context = context || window
  const fn = Symbol()
  context[fn] = this
  const result = context[fn](...args)
  delete context[fn]
  return result
}

模拟实现apply

  • 与call方法类似,参数为数组
Function.prototype.myApply = function(context = window, args) {
  if(this === Function.prototype) {
    return undefined
  }
  const fn = Symbol()
  context[fn] = this
  let result
  if(Array.isArray(args)) {
    result = context[fn](args) 
  } else {
    result = context[fn] 
  }
  delete context[fn]
  return result
}

模拟实现bind

  • 返回一个新函数
  • 新函数this指向bind的第一个参数
  • 其余参数作为新函数的参数传入
Function.prototype.myBind = function(context = window, ...args1) {
  if(this === Function.prototype) {
    throw new TypeError('Error') 
  }
  const _this = this
  return function F(...args2) {
    if(this instanceof F) {
      return new _this(...args1, ...args2) 
    }
    return _this.apply(context, args1.concat(args2))
  }
}