解释 JavaScript 中“this”的工作原理

在 JavaScript 中,this 关键字指向的对象会根据函数的调用方式而发生变化。它的工作原理可以概括为以下几点:

1:默认绑定:
当函数被直接调用时(不是作为对象的方法),this 会默认指向全局对象(浏览器中为 window, Node.js 中为 global)。
例如: function foo() { console.log(this); }; foo(); // 输出全局对象

2:隐式绑定:
当函数作为对象的方法被调用时,this 会隐式绑定到该对象。
例如: const obj = { foo: function() { console.log(this); }}; obj.foo(); // 输出 obj 对象

3:显式绑定:
可以使用 call()、apply() 或 bind() 方法来显式地绑定 this 的值。
例如: function foo() { console.log(this.a); }; const obj = { a: 2 }; foo.call(obj); // 输出 2

4:new 绑定:
当函数被用作构造函数(使用 new 关键字调用)时,this 会绑定到新创建的对象实例。
例如: function Person(name) { this.name = name; }; const p = new Person(‘John’); // this 指向新创建的 p 实例

5: 箭头函数:
箭头函数没有自己的 this 值,它会继承外层作用域中的 this 值。
例如: const obj = { foo: () => { console.log(this); }}; obj.foo(); // 输出全局对象

this 的绑定规则遵循一个优先级顺序:new 绑定 > 显式绑定 > 隐式绑定 > 默认绑定。理解 this 的工作原理对于编写高质量的 JavaScript 代码非常重要,尤其是在处理回调函数、事件处理器以及面向对象编程时

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/web/22264.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

delphi教程

1.While 循环 While 语句的语法格式为: While 条件表达式 do 循环语句; 循环语句可以是任何合法的语句,也可以是另一个循环语句。条件表达式返回一个逻辑 类型的值,当其为 True 时,系统执行其后的循环语句,…

王学岗鸿蒙开发(北向)——————(一)鸿蒙开发环境的搭建与ArkTs介绍

1,鸿蒙系统开始研发的时间是在2012年。 2,目前鸿蒙有两个开发:HarmonyOS和OpenHarmony,前者内聚AOSP(Android的东西),前者是双框架结构,后者不是双框架结构,没有内置安卓。 3,Harmony地址 4,我们…

Flutter 中的 InheritedTheme 小部件:全面指南

Flutter 中的 InheritedTheme 小部件:全面指南 Flutter 是一个由 Google 开发的跨平台 UI 框架,它允许开发者使用 Dart 语言构建高性能、美观的移动、Web 和桌面应用。在 Flutter 的丰富组件库中,InheritedTheme 是一个特殊的组件&#xff0…

文件上传漏洞之upload-labs

前提: 本文中的以xshell命名的均为以密码为admin的一句话木马,而shell命名的则是由冰蝎工具生成的木马。 pass-01:js前端验证 测试性的上传一个一句话木马,发现被拦截了,而且根据推测大概率是前端检测,于…

国内PLM系统厂商,国内PLM系统哪个公司最受欢迎

国内PLM系统厂商,国内PLM系统哪个公司最受欢迎 国内PLM系统厂商中,要确定哪个公司的产品最受欢迎,需要考虑多个因素,包括市场份额、客户评价、技术实力、产品线完整性以及服务支持等。虽然无法直接给出一个具体的“最受欢迎”的排名&#xff…

Docker部署MYSQL8.0发现启动了却无法连接,Navicat连接后项目正常连接的解决方案

Docker部署MYSQL8.0发现启动了却无法连接,使用Navicat连接后项目正常连接 客户端不支持caching_sha2_password的加密方式 可进入容器处理或使用navicat连接后修改 # 进入mysql容器内容 docker exec -it mysql bash # 进入输入下面命令 ,然后输入密码 mysql -u roo…

闲鱼无货源-高级班,最全·最新·最干,紧贴热点 深度学习(17节课)

课程目录 1-1:闲鱼潜规则_1.mp4 2-2:闲鱼的基础操作-养号篇_1.mp4 3-3:闲鱼实战运营-选品篇(一)_1.mp4 4-4:闲鱼实战运营-选图视频篇_1.mp4 5-5:闲鱼实战运营-标题筒_1.mp4 6-6&#xff1…

伯克希尔也被ST?

地球(最)贵股票突然闪崩,美股故障再次上演。昨晚齐刷刷一片的美股出现行情异常,伯克希尔、蒙特利尔银行、巴里克黄金等股票股价跌幅超过98%。其中,巴菲特旗下伯克希尔哈撒韦A类股股价更是暴跌99.97%,股价从…

Java集合简略记录

一、集合体系结构 单列集合:Collection 双列集合:Map 二、单列集合 List系列集合:添加的元素是有序、可重复、有索引 有序指的是存和取的顺序是一致的,和之前排序的从小到大是没有任何关系的 Set系列集合:添加的元素是…

webrtc vp8/9视频编解码介绍

在WebRTC中,VP8和VP9是两种常用的视频编码格式,由Google开发。这两种编码都属于开源项目,因此它们被广泛应用于需要编解码视频流的应用中,特别是在WebRTC这类实时通信技术中非常关键。 一、libvpx项目介绍 libvpx项目地址 https://chromium.googlesource.com/webm/libvpx…

拼多多笔试

拼多多2022数据分析笔试(0822) 一、选择题 1.已知样本量n,样本均值及方差求置信区间 2.决策树 3.峰度系数 4.协方差 5.第一、第二熵变 6.充分统计量 7.xgboost 8.方差分析中的多重比较 二、编程题 1. 一张用户点击路径的表&#x…

FL Studio21.2.8中文版水果音乐制作的革新之旅!

在数字化浪潮的推动下,音乐制作领域经历了翻天覆地的变化。从最初的模拟技术到如今的全数字化处理,音乐制作的门槛被大幅降低,越来越多的音乐爱好者和专业人士开始尝试自行创作和编辑音乐。在这个过程中,各种专业音乐制作软件成为…

勒索软件分析_目标文件扫描行为分析

BlackBasta首先通过 FindFirstVolumeW 与 FindNextVolumeW 实现系统中第一个卷的搜索和其余卷的遍历,之后通过 GetVolumePathNamesForVolumeNameW 检索指定卷的驱动器号和挂载的文件夹路径列表,然后通过 GetVolumeInformationW 获取关于指定卷的信息,具体代码如下所示。 Fin…

Numpy切片操作

基本切片: arr[start:stop:step]: 从索引start开始到stop结束(不包括stop),步长为step。 省略切片: arr[:]: 复制整个数组。arr[:5]: 选择数组的前5个元素。arr[5:]: 选择从索引5开始到数组末尾的元素。 步长切片: arr[::2]: 选择数组中的每个…

几何(geometry)

题目描述 小可可最近在学习平面几何! 给定平面上的 n n n个点 ( x 1 , y 1 ) , ( x 2 , y 2 ) , … , ( x i , y i ) (x_1,y_1),(x_2,y_2),…,(x_i,y_i) (x1​,y1​),(x2​,y2​),…,(xi​,yi​)。 根据题目要求,输出下列两个值其中一个: 任意两点间欧几里得距…

yolov8逐步分解(9)_训练过程之Epoch迭代过程

yolov8逐步分解(1)--默认参数&超参配置文件加载_yolov8 加载yaml配置 预测-CSDN博客 yolov8逐步分解(2)_DetectionTrainer类初始化过程_train and val are required in all data yamls.-CSDN博客 yolov8逐步分解(3)_trainer训练之模型加载_yolov8 加载模型-CSDN博客 YOL…

TCP 建链(三次握手)和断链(四次握手)

TCP 建链(三次握手)和断链(四次挥手) 背景简介建链(三次握手)断链(四次挥手)序号及标志位延伸问题为什么建立连接需要握手三次,两次行不行?三次握手可以携带数…

智领未来,安全无忧:智能网联汽车监控大屏的守护之旅

在繁忙的都市中,驾驶者往往面临着诸多安全隐患。传统的驾驶辅助系统虽然能够提供一定的帮助,但在复杂多变的交通环境中,其局限性也逐渐显现。而智能网联汽车安全监控大屏,正是为了解决这一问题而诞生的。 山海鲸可视化大屏 大屏采…

基础篇04——多表查询

多表关系 一对多 多对多 多对多是通过中间表实现的 -- 创建学生表 create table student (id int auto_increment primary key comment ID,name varchar(10) comment 姓名,no varchar(3) comment 学号 ) comment 学生表;insert into student values (null, 黛绮丝, 001),(…