JS手写call方法

call方法是JS function中内置的一个方法,主要的作用有两个:

  • 改变函数的this指向
  • 向函数中传递参数

使用方式如下:

javascript 复制代码
fn.call(obj, 100, 200)

实现代码示例:

javascript 复制代码
Function.prototype.myCall = function(ctx, ...args) {

  ctx = ctx === undefined || ctx === null ? globalThis : Object(ctx)
  // 定义一个符号,使其唯一
  const key = Symbol()

  // 这样定义,使符号不可枚举
  Object.defineProperty(ctx, key, {
    value: this,
    enumerable: false
  })
  const r = ctx[key](...args)

  // 运行完没用了,就可以删除掉
  delete ctx[key]

  return r
}

function method(a, b) {
  console.log(this, 'this')
  console.log(a, b, 'args')
}

const a = {
  a: 2
}

method.myCall(a, 2, 3)
// 输出结果:{ a: 2 } this
//          2 3 args


method.myCall(this, 2, 3)
// node 环境没有 this
// 输出结果:{} this
//          2 3 args

method.myCall(1, 2, 3)
// 输出结果:[Number: 1] this
//          2 3 args
相关推荐
一次旅行15 分钟前
多智能体编排实战:拆解Plan-and-Execute范式+三层记忆架构,手写无依赖轻量Agent调度引擎
前端·javascript·架构
用户昵称10030 分钟前
C/C++编程-工程实践-本地存储log的工程意义
c语言·开发语言
小玮看世界1 小时前
[Python]从“脏”数据到优雅实现:一个IoT滑动窗口最大值问题的测试驱动优化实录
linux·前端·python
吹什么轩2 小时前
c++复习:map和set的使用
开发语言·c++
尤乐娃子2 小时前
进入大厂(厂子大)实习Day11
前端·笔记·实习
必须得开心呀2 小时前
qt生成dump文件并定位异常
开发语言·qt
fpcc2 小时前
跟我学C++中级篇—内存流
开发语言·c++
xiaoxiangsiyan2 小时前
运维之前端反调试学习
运维·前端·学习·状态模式
Cicada1282 小时前
ccvt:一个用 Rust 写的中国地图坐标系互转命令行工具
开发语言·后端·rust