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
相关推荐
穿过锁扣的风16 小时前
如何操作HTML网页
前端·javascript·html
San30.16 小时前
从零构建坚固的前端堡垒:TypeScript 与 React 实战深度指南
前端·react.js·typescript
小北方城市网16 小时前
Spring Boot 多数据源与事务管理实战:主从分离、动态切换与事务一致性
java·开发语言·jvm·数据库·mysql·oracle·mybatis
痴儿哈哈16 小时前
C++与硬件交互编程
开发语言·c++·算法
yunhuibin16 小时前
VideoPipe环境搭建及编译ubuntu240403
前端·人工智能
roman_日积跬步-终至千里16 小时前
【Java 并发-面试】从线程基础到企业级开发的知识点概况
java·开发语言
云中飞鸿16 小时前
VS2015安装后,安装QT59,之后安装qt-vsaddin-msvc2015-2.4.3.vsix 文件失败问题!
开发语言·qt
m0_7482331717 小时前
C与C++:底层编程的六大核心共性
java·开发语言
沐知全栈开发17 小时前
HTTP Content-Type
开发语言
一切尽在,你来17 小时前
C++多线程教程-1.2.2 C++标准库并发组件的设计理念
开发语言·c++