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

面试题:说说你对 JS 中 this 指向的了解

面试题:说说你对 JS 中 this 指向的了解

JS 的代码执行环境分为严格模式和非严格模式,可以通过 use strict 打开严格模式,此时 JS 在语法检查上会更加严格。要讨论 JS 中的 this 指向问题,也要分为严格模式和非严格模式进行讨论。这里先讨论非严格模式下的 this 指向,然后再讨论严格模式下的不同之处,未谈到的地方默认与严格模式相同。

非严格模式下的 this 指向

  1. 函数独立调用:此时函数中的 this 指向全局对象(浏览器环境是 window,Node.js 环境是 globalThis

  2. 函数作为对象的方法调用:此时函数中的 this 指向该对象。

  3. 函数通过 callapply 调用callapply 方法可以用于直接调用函数,同时指定 this 和传入参数。

    如果 callapply 传入的表示 this 的参数不是对象(原始值),其会被隐式转换为对应的包装对象。

    const obj = new Object();
    fun_name.call(obj, param1, param2,...); // 调用 fun_name 函数,同时指定 this 为 obj,传入多个参数
    fun_name.call(obj, [parm1, param2, ...]); // 调用 fun_name 函数,同时指定 this 为 obj,传入一个数组参数
    
  4. 调用经 bind 生成的函数bind 方法可以生成一个新的函数,同时指定新函数的 this

    如果 bind 传入的表示 this 的参数不是对象(nullundefined),其会被隐式转换为全局对象 windowglobalThis

    const obj = new Object();
    const new_fun = fun_name.bind(obj); // 生成一个新函数,同时指定新函数中的 this
    new_fun();
    
  5. 调用 new 构造函数:此时构造函数中的 this 指向创建的新对象。

  6. 箭头函数调用:箭头函数没有自己的 this,其使用 this 时会捕获其声明位置的上下文中的 this

  7. 时间处理函数调用:此时函数中的 this 通常指向触发事件的 DOM 元素。

注意:这里的函数默认是非箭头函数。

严格模式下的 this 指向

  1. 函数独立调用: 此时 this 指向 undefined
  2. callapplybind 相关的函数调用:如果 callapplybind 传入的表示 this 的参数不是对象(nullundefined),其会仍会保持为原始值。(该是啥就是啥)
http://www.lryc.cn/news/364273.html

相关文章:

  • 分享一个实用的MySQL一键巡检脚本
  • 【动手学深度学习】卷积神经网络CNN的研究详情
  • 2024年数字化经济与智慧金融国际会议(ICDESF 2024)
  • kafka-消费者服务搭建配置简单消费(SpringBoot整合Kafka)
  • C++STL---list常见用法
  • MQTT.FX的使用
  • SRS、ZLMediakit音视频流媒体服务器
  • 大模型Prompt-Tuning技术进阶
  • 统一响应,自定义校验器,自定义异常,统一异常处理器
  • 完整状态码面试背
  • QT+FFmpeg+Windows开发环境搭建(加薪点)
  • Linux 主机一键安全整改策略
  • Hot100——二叉树
  • C++ static_cast、dynamic_cast、const_cast 和 reinterpret_cast 用处和区别
  • 三十七、openlayers官网示例Earthquakes Heatmap解析——在地图上加载热力图
  • curl 92 HTTP/2 stream 5 was not closed cleanly: CANCEL
  • Spring Security 注册过滤器关键点与最佳实践
  • 力扣2024.考试的最大困扰度
  • java配置文件解析yml/xml/properties文件
  • grpc接口调用
  • 通信技术振幅键控(ASK)调制与解调硬件实验
  • 自动化办公02 用openpyxl库操作excel.xlsx文件(新版本)
  • 用户反馈解决方案 —— 兔小巢构建反馈功能
  • git 下载失败
  • 力扣1438.绝对差不超过限制的最长连续子数组
  • 如何避免Python中默认参数带来的陷阱
  • 代码随想录算法训练营第五十天|198.打家劫舍、213.打家劫舍II、337.打家劫舍III
  • VB.net 进行CAD二次开发(二)
  • 安徽某高校数据挖掘作业6
  • CMakeLists.txt和Package.xml