当前位置: 首页 > news >正文

前端面经 8 JS中的this 手写call apply bind方法

默认全局对象 常见指向调用对象

改变方法:call() apply() bind()

在这里插入图片描述

严格模式声明写在最顶端

在这里插入图片描述

全局执行环境中,指向全局对象 windows

函数中,第一类直接调用的情况 非严格模式 windows 严格模式 undefined

对象方法一直为调用者

在这里插入图片描述

输出结果 windows windows

在这里插入图片描述

输出结果:windows undefined

定义 在Fuction类的原型对象上面挂载 myCall()方法

手写call()方法

Function.prototype.myCall = function(thisArg,...args){thisArg.f = this// 这里的this是原型对象中挂载方法内的this 依旧指向调用者 this指向调用者 // 这里的this是调用call方法的函数表达式const res = thisArg.f(...args)delete thisArg.f// 使用剩余参数 return res}

call中继续使用p 属性存在同名风险

找到一个绝对不会重名的方法 使用Symbol属性

 <script>Function.prototype.mycall = function(thisArg,...arg){const key = Symbol()thisArg[key] = thisconst res = thisArg[key](...arg)delete thisArg[key]return res}function mylog(){console.log(this)return {1:5}}console.log(mylog.call({1:5}))// 使用内置Symbol内置函数</script>

手写apply()方法

    <script>Function.prototype.myapply =function(thisArg,args){const key = Symbol()thisArg[key] = thisconst res = thisArg[key](...args)delete thisArg[key]return res}function sum(num1,num2){console.log(this)return (num1+num2)}console.log(sum.myapply({1:5},[1,2]))</script>

手写 bind()方法

    <script>Function.prototype.mybind = function(thisArg,...args){return (...reargs)=>{return this.call(thisArg,...args,...reargs)}}function print(x,y,z,h){console.log(this)console.log(x)console.log(y)console.log(z)console.log(h)}const fnc = print.mybind({1:9},1,2)fnc(3,4)</script>
http://www.xdnf.cn/news/488197.html

相关文章:

  • 将嵌入映射到 Elasticsearch 字段类型:semantic_text、dense_vector、sparse_vector
  • 火山引擎AI大模型
  • vue-router 中传递参数中的问题
  • 【基础】Windows开发设置入门3:在 Windows 11 上设置开发驱动器,提升性能速度
  • 适合使用分区表的典型业务场景
  • 用Python绘制动态樱花树(附完整源码解析)
  • React组件(一):生命周期
  • Linux下软件安装
  • C++ asio网络编程(7)增加发送队列实现全双工通信
  • Maven Deploy的依赖与引用方的依赖不同
  • 信奥赛-刷题笔记-队列篇-T4-P7912小熊的果篮
  • MySQL 数据库优化:InnoDB 存储引擎深度解析:架构、调优与最佳实践
  • 记录一个为打印高清而做投喂图像增强的例子
  • docker compose 启动指定的 service
  • MongoTemplate 基础使用帮助手册
  • 12条热门照片提示
  • XS9922C芯片:多能一体的视频处理强者,可p2p替代TP9930和TP9932,开启智能视觉新征程
  • Flask框架深度解析:蓝图、上下文机制与Jinja2模板引擎实战
  • ssh 配置了.ssh/authorized_keys 依旧需要密码的问题
  • 如何同时管理不同平台的多个账号?
  • 【第七节】ESP32-S3 霍尔传感器应用实战:磁场检测与蜂鸣器控制
  • 小学数学题批量生成及检查工具
  • PT2062单触控单输出LED调光IC
  • python报错:应为类型Union[str,int],但实际为None问题原因及解决方案
  • HGDB索引膨胀的检查与处理思路
  • 哈希表实现(1):
  • 【言语】刷题5(填空)
  • 2025-05-15 代码人生 - 精选文章周刊
  • Microsoft Azure 服务4月更新告示
  • 简化WPF开发:CommunityToolkit属性绑定与命令声明实战