不正确的引用 this

随着JavaScript编码技术和设计模式多年来变得越来越复杂,回调和闭包中的自引用作用域也相应增加,这是造成JavaScript问题的 "this/that 混乱 "的一个相当普遍的来源。

考虑下面代码:

Game.prototype.restart = function () {this.clearLocalStorage();this.timer = setTimeout(function() {this.clearBoard();    // What is "this"?}, 0);
};

执行上述代码会出现以下错误:

Uncaught TypeError: undefined is not a function

上述错误的原因是,当调用 setTimeout()时,实际上是在调用 window.setTimeout()。因此,传递给setTimeout()的匿名函数是在window对象的上下文中定义的,它没有clearBoard()方法。

传统的、符合老式浏览器的解决方案是将 this 引用保存在一个变量中,然后可以被闭包继承,如下所示:

Game.prototype.restart = function () {this.clearLocalStorage();var self = this;   // Save reference to 'this', while it's still this!this.timer = setTimeout(function(){self.clearBoard();    // Oh OK, I do know who 'self' is!}, 0);
};

另外,在较新的浏览器中,可以使用bind()方法来传入适当的引用:

Game.prototype.restart = function () {this.clearLocalStorage();this.timer = setTimeout(this.reset.bind(this), 0);  // Bind to 'this'
};Game.prototype.reset = function(){this.clearBoard();    // Ahhh, back in the context of the right 'this'!
};

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

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

相关文章

蓝桥杯第1037题子串分值和 C++ 字符串 逆向思维 巧解

题目 思路和解题方法 方案一——遍历哈希表 仅能过60%样例,大多数同学都用的该方法&#xff0c;就不过多赘述 #include <iostream> #include <unordered_map> using namespace std; int main() {string s;cin >> s;int n s.size();int res n;for (int i 0…

各类声音数据集大合集—乐器、车辆、鸟鸣、蜜蜂声音、歌曲、喇叭、人类声音不同等类型的声音数据集

最近收集了一大波关于各类声音的数据集&#xff0c;包含乐器、车辆、鸟鸣、蜜蜂声音、歌曲、喇叭、人类声音不同等类型的声音数据集&#xff0c;废话不多说&#xff0c;给大家逐一介绍&#xff01;&#xff01; 1、吉他和弦大调、小调数据集 吉他和弦大调、小调数据集&#x…

Vue基础知识点梳理

在Vue中&#xff0c;被用来响应地更新HTML属性的指令是v-model页面挂载成功之后会触发哪一个钩子函数mounted挂载之后会进行页面的渲染v-on是动作元素不属于条件渲染指令 在Vue中&#xff0c;下列关于Vue实例对象说法不正确的是&#xff08;&#xff09;。A.Vue实例对象是通过n…

Linux docker批量安装软件

1.前提 具备docker-compose.yml 和 prometheus.yml 文件 常见报错&#xff1a; 1.没有配置network 配置network即可&#xff1a; 2.缺少相关依赖 docker-compose.yml加入相关配置 3.重复项 删除掉重复的 最后 执行 等待完成 下载后相当于有了这些软件包的镜像 启动的每…

思维模型 同体效应

本系列文章 主要是 分享 思维模型&#xff0c;涉及各个领域&#xff0c;重在提升认知。我们是自己人。 1 同体效应的应用 1.1 同体效应在市场营销上的应用-耐克的“Just Do It”营销活动 耐克是一家全球知名的运动品牌&#xff0c;其“Just Do It”营销活动是市场营销领域的经…

深度学习常见回归分支算法逐步分析,各种回归之间的优缺点,适用场景,举例演示

文章目录 1、线性回归&#xff08;Linear Regression&#xff09;1.1 优点1.2 缺点1.3 适用场景1.4 图例说明 2、多项式回归&#xff08;Polynomial Regression&#xff09;2.1 优点2.2 缺点2.3 适用场景2.4 图例说明 3、决策树回归&#xff08;Decision Tree Regression&#…

【哈希】49.字母异位词分组

力扣 class Solution {public List<List<String>> groupAnagrams(String[] strs) {Map<String, List<String>> map new HashMap<>();for (String str : strs) {String hash getHash(str);map.computeIfAbsent(hash, k -> new ArrayList<…

2312skia,15vulkan及技巧

ANGLE介绍 ANGLE,把OpenGLES2或3调用转换为DirectX9,11或OpenGL调用.这些说明记录了如何在Windows或Linux上使用ANGLE而不是本地OpenGL后端. 细节 gclient sync下载ANGLE的源码及Skia的其他仅测试依赖项. 要针对ANGLE构建Skia测试工具,请添加skia_use_angletrue到args.gn文件…

Beta冲刺随笔-DAY6-橘色肥猫

这个作业属于哪个课程软件工程A这个作业要求在哪里团队作业–站立式会议Beta冲刺作业目标记录Beta冲刺Day6团队名称橘色肥猫团队置顶集合随笔链接Beta冲刺笔记-置顶-橘色肥猫-CSDN博客 文章目录 SCRUM部分站立式会议照片成员描述 PM报告项目程序&#xff0f;模块的最新运行图片…

boost-filesystem-删除复制文件-设置文件权限-递归创建删除复制文件夹-解析文件名-C++

文章目录 1.简介2.路径合法性3.路径处理及迭代器4.设置权限5.文件操作6.迭代目录6.1. directory_iterator6.1.1.类摘要6.1.2.单层目录迭代6.1.3.directory_iterator深度遍历目录(递归) 6.2.recursive_directory_iterator6.2.1. 类摘要6.2.2 示例代码 7.查找文件、模糊查找文件、…

制作一个RISC-V的操作系统二-RISC-V ISA介绍

文章目录 ISA的基本介绍啥是ISA为什么要设计ISACISCvsRISCISA的宽度知名ISA介绍 RISC-V历史和特点RISC-V发展RISC-V ISA 命名规范模块化的ISA通用寄存器Hart特权级别Control and Status Register&#xff08;CSR&#xff09;内存管理与保护异常和中断 ISA的基本介绍 啥是ISA …

<DB2>《AIX环境下DB2冷备机恢复方案(生产实践)》

《AIX环境下DB2冷备机恢复方案&#xff08;生产实践&#xff09;》 1 DB2数据库常见备份方式简要说明2 方案说明3 实际方案&#xff08;信息已脱敏&#xff09;3.1 基本信息3.2 创建互信3.3 部署scp脚本3.4 在冷备机192.168.16.165上部署恢复脚本3.5 在冷备机192.168.16.165上部…

【UE】UEC++获取屏幕颜色GetPixelFromCursorPosition()

目录 【UE】UE C 获取屏幕颜色GetPixelFromCursorPosition() 一、函数声明与定义 二、函数的调用 三、运行结果 【UE】UE C 获取屏幕颜色GetPixelFromCursorPosition() 一、函数声明与定义 创建一个蓝图方法库方法 GetPixelFromCursorPosition()&#xff0c;并给他指定UF…

【MATLAB】RLMD分解+FFT+HHT组合算法

有意向获取代码&#xff0c;请转文末观看代码获取方式~也可转原文链接获取~ 1 基本定义 RLMD分解FFTHHT组合算法是一种强大的分析方法&#xff0c;结合了局部均值分解&#xff08;LMD&#xff09;、快速傅里叶变换&#xff08;FFT&#xff09;和希尔伯特-黄变换&#xff08;H…

WIN10 WIN11 关闭更新的绝佳办法(极简单无副作用)

WIN10 WIN11 关闭更新的绝佳办法&#xff08;极简单无副作用&#xff09; 极其简单用实用可以关闭更新20年 winr&#xff0c;输入regedit 打开注册表打开注册表的这个路径&#xff1a; 计算机\HKEY_LOCAL_MACHINE\SOFTWARE\Microsoft\WindowsUpdate\UX\Settings 右键空白的地方…

图文深入理解TCP三次握手

前言 TCP三次握手和四次挥手是面试题的热门考点&#xff0c;它们分别对应TCP的连接和释放过程&#xff0c;今天我们先来认识一下TCP三次握手过程&#xff0c;以及是否可以使用“两报文握手”建立连接&#xff1f;。 1、TCP是什么&#xff1f; TCP是面向连接的协议&#xff0c;…

QT 中使用 QTableView 和 QStandardItemModel 实现将数据导出到Excel 和 从Excel导入到 QTableView 的功能

简介 在Qt中&#xff0c;使用QTableView和QStandardItemModel来实现将数据导出到Excel和从Excel导入到QTableView的功能&#xff0c;而不使用第三方库&#xff08;如QXlsx&#xff09;。 效果 将 QTableView 中的数据导出到Excel //从tableview 导出到 EXcle void MainInterfa…

编程中常见的技术难题和解决策略

编程中常见的技术难题有哪些&#xff1f; 编程中常见的技术难题 在编程过程中&#xff0c;我遇到了一些常见的技术难题&#xff0c;这些难题不仅仅是挑战&#xff0c;也是学习和成长的机会。以下是其中的一些例子&#xff1a; 复杂的并发和多线程问题 在一个多用户的系统中&a…

【PTA题目】7-2 完美的素数 分数 20

7-2 完美的素数 分数 20 全屏浏览题目 切换布局 作者 伍建全 单位 重庆科技学院 一个十进制数&#xff0c;如果是素数&#xff0c;而且它的各位数字和也是素数&#xff0c;则称之为“美素数”&#xff0c;如29&#xff0c;本身是素数&#xff0c;而且29 11也是素数&#x…

MQTT协议理解并实践

MQTT是一个轻量的发布订阅模式消息传输协议&#xff0c;专门针对低带宽和不稳定网络环境的物联网应用设计 MQTT协议根据主题来分发消息进行通信&#xff0c;支持通配符匹配&#xff0c;可以低开销的使用数百万Topic进行一对一&#xff0c;一对多双向通信。 协议特点 1. 开放…