setInterval方法中this指向问题

待我称王封你为后i 2023-06-17 11:57 36阅读 0赞

在setTimeOut()或setInterval()这样的方法中，如果传入的函数包含this, 那么，默认情况下，函数中的this会指向window对象。这是由于setTimeout()调用的代码运行在与所在函数完全分离的执行环境上。这会导致这些代码中包含的 this 关键字会指向 window (或全局)对象。

百度了网上的解决方法，如下

### **1. 将当前对象的this存为一个变量** ###

定时器内部的函数来访问到这个变量，此时的this，就指向了当前对象

function doClick(){
        var that = this;
        setInterval(function() {
          console.log(that.msg);
         }, 1000);
    }

### **2. 利用bind()方法** ###

function doClick(){
        setInterval(function() {
          console.log(this.msg);
         }.bind(this), 1000);  //利用bind()将this绑定到这个函数上
    }

### 3. ES6的箭头函数 ###

ES6中的箭头函数, this总是指向词法作用域，也就是外层调用者obj，因此利用箭头函数就可以轻松解决这个问题

function doClick(){
         setInterval(() => {
           console.log(this.msg);
         }, 100);
     },

**如何准确判断 this 指向的是什么？**（转自前端小姐姐）

1 . 函数是否在 new 中调用 (new 绑定)，如果是，那么 this 绑定的是新创建的对象。

2 . 函数是否通过 call,apply 调用，或者使用了 bind(即硬绑定)，如果是，那么 this 绑定的就是指定的对象。

3 . 函数是否在某个上下文对象中调用 (隐式绑定)，如果是的话，this 绑定的是那个上下文对象。一般是 obj.foo()。

4 . 如果以上都不是，那么使用默认绑定。如果在严格模式下，则绑定到 undefined，否则绑定到全局对象。

5 . 如果把 Null 或者 undefined 作为 this 的绑定对象传入 call、apply 或者 bind，这些值在调用时会被忽略，实际应用的是默认绑定规则。

6 . 如果是箭头函数，箭头函数的 this 继承的是外层代码块的 this。

发表评论取消回复

表情：

评论列表（有 0 条评论，36人围观）

还没有评论，来说两句吧...

相关阅读

相关前端js中this指向及改变this指向的方法

一、 this this是JS中的关键字，它始终指向了一个对象， this是一个指针; 参考博文： [this指向及改变this指向的方法][this_this...

本是古典何须时尚/ 2024年04月17日 06:05/ 0 赞/ 113 阅读

相关 setInterval方法中this指向问题

在setTimeOut()或setInterval()这样的方法中，如果传入的函数包含this, 那么，默认情况下，函数中的this会指向window对象。这是由于setTim

待我称王封你为后i/ 2023年06月17日 11:57/ 0 赞/ 37 阅读

相关关于setInterval和setTImeout中的this指向问题

问题：setInterval和setTimeout中传入函数时，函数中的this会指向window对象我们先来看一个例子： var num = 0;

悠悠/ 2023年03月03日 04:53/ 0 赞/ 22 阅读

相关 this指向问题

全局上下文非严格模式和严格模式中this都是指向顶层对象（浏览器中是window）。 1.默认绑定独立调用普通函数调用，此时 this

妖狐艹你老母/ 2022年11月29日 12:54/ 0 赞/ 245 阅读

相关 setInterval中this问题,以及bind绑定this的指向问题

Javascript对象中关于setTimeout和setInterval的this介绍，需要的朋友可以参考下在Javascript里，setTimeout和setInte

柔情只为你懂/ 2022年06月18日 05:42/ 0 赞/ 216 阅读

相关 this指向问题

this指向问题。 this指向 -------------------- ღ 函数预编译过程中，this指向window。在函数里定义一个th

àì夳堔傛蜴生んèń/ 2022年05月26日 05:23/ 0 赞/ 289 阅读

相关关于setTimeOut和setInterval改变this指向的问题解决方法

在setTimeOut()或setInterval()这样的方法中，如果传入的函数包含this, 那么，默认情况下，函数中的this会指向window对象。这是由于setTim

亦凉/ 2022年05月13日 01:46/ 0 赞/ 220 阅读

相关关于setInterval和setTImeout中的this指向问题

问题描述前些天在练习写一个小例子的时候用到了定时器，发现在setInterval和setTimeout中传入函数时，函数中的this会指向window对象，如下例：

忘是亡心i/ 2022年05月11日 01:38/ 0 赞/ 248 阅读

相关 JavaScript中this指向问题

this的指向在函数定义的时候是确定不了的，只有函数执行的时候才能确定，this最终指向调用它的对象。 1.通过函数名直接调用，this指向window func

小灰灰/ 2022年04月22日 15:18/ 0 赞/ 266 阅读

相关 JavaScript中this指向问题

什么是this？在JS中，this的指向是调用时决定的，不是创建时决定的，this具有运行期绑定的特性全局上下文 this等价于window对象 var

系统管理员/ 2021年09月01日 04:36/ 0 赞/ 515 阅读