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

javascript中setInterval与setTimeout中this的问题以及对于闭包的一些理解

  最近写代码是碰到一个setInterval中的this指针的问题,代码如下:

var testClass = function () {
    this.name = "test";
    this.intervalId = null;
};

testClass.prototype.start = function () {
    this.intervalId = setInterval(this.sayHello, 1000);
}

testClass.prototype.sayHello = function () {
    console.log("Hello, " + this.name);
}

var test = new testClass();
test.start(); //输出“Hello,”

  当时第一反应就是this指针出问题了,但是不知道怎么解决,因为setInterval中传入的只是函数的名字,并不是调用,所以我们没法通过保存this的方法来实现,经过多番搜索,找到如下几种解决方案。

  1. 使用bind函数,会有浏览器兼容问题

this.intervalId = setInterval(this.sayHello.bind(this), 1000);

  bind函数类似call函数,都会改变上下文的this,但是bind返回的是函数,而call则会调用函数。

  2.使用闭包,保存this变量

this.intervalId = setInterval(function () {
var self = this; return function() { self.sayHello();//有位大神解释闭包,闭包就是可以访问另一个函数内部而它自身外部的变量的函数,js类中的私有变量等就是通过闭包来实现权限控制的 }; }.call(this), 1000);

  个人理解闭包其实就是在一个函数内有可以被外部访问的内部函数,能被访问的内部函数就是闭包,例如:

var a = function () {
    function b() {//不是闭包,因为外部不能访问它
        console.log(b);
    };
    return function c() {//闭包,外部可以访问
        console.log(c);
    }
}

  

  理解的不知道对不对,敬请指教!!

  

转载于:https://www.cnblogs.com/DARKDD/p/4279595.html

相关文章:

  • 针对PostMessage和SendMessage区别的一个试验
  • 【spring框架】beans.xml规范与ClassPathXmlApplicationContext类介绍
  • It's not a Bug, It's a Feature! --POJ 1482
  • postgresql 死锁问题解决记录
  • WCF Data Services客户端访问
  • css知多少(4)——解读浏览器默认样式
  • Breakthrough—JavaScript基础
  • 辛苦几个小时,终于装完主机了
  • 【连载】【FPGA黑金开发板】Verilog HDL那些事儿--PS2封装(十八)
  • android httpClient 支持HTTPS的2种处理方式
  • 一步一步教你使用AgileEAS.NET基础类库进行应用开发-基础篇阶段总结与WinForm篇展望...
  • 如何开启常用端口和其他端口
  • C# HttpRequest基础连接已经关闭: 接收时发生意外错误
  • 学习笔记----安装nginx
  • 从零开始学android开发-查看sqlite数据库
  • android高仿小视频、应用锁、3种存储库、QQ小红点动画、仿支付宝图表等源码...
  • Docker: 容器互访的三种方式
  • gf框架之分页模块(五) - 自定义分页
  • Github访问慢解决办法
  • iBatis和MyBatis在使用ResultMap对应关系时的区别
  • JavaScript 基础知识 - 入门篇(一)
  • java取消线程实例
  • Java小白进阶笔记(3)-初级面向对象
  • ng6--错误信息小结(持续更新)
  • Promise面试题,控制异步流程
  • underscore源码剖析之整体架构
  • VUE es6技巧写法(持续更新中~~~)
  • 给Prometheus造假数据的方法
  • 前端面试题总结
  • 前端面试之CSS3新特性
  • 深度学习在携程攻略社区的应用
  • 网页视频流m3u8/ts视频下载
  • 新版博客前端前瞻
  • 移动端 h5开发相关内容总结(三)
  • ​iOS实时查看App运行日志
  • #define与typedef区别
  • #HarmonyOS:基础语法
  • (02)vite环境变量配置
  • (Note)C++中的继承方式
  • (ZT)薛涌:谈贫说富
  • (详细版)Vary: Scaling up the Vision Vocabulary for Large Vision-Language Models
  • (原創) 是否该学PetShop将Model和BLL分开? (.NET) (N-Tier) (PetShop) (OO)
  • ..thread“main“ com.fasterxml.jackson.databind.JsonMappingException: Jackson version is too old 2.3.1
  • .FileZilla的使用和主动模式被动模式介绍
  • .Net IE10 _doPostBack 未定义
  • .NET MAUI学习笔记——2.构建第一个程序_初级篇
  • .NET 中的轻量级线程安全
  • .net 重复调用webservice_Java RMI 远程调用详解,优劣势说明
  • .net反混淆脱壳工具de4dot的使用
  • .net实现客户区延伸至至非客户区
  • .vimrc php,修改home目录下的.vimrc文件,vim配置php高亮显示
  • @SuppressLint(NewApi)和@TargetApi()的区别
  • [ 隧道技术 ] 反弹shell的集中常见方式(四)python反弹shell
  • [BZOJ] 3262: 陌上花开
  • [bzoj1912]异象石(set)