篮球外围下注_篮球投注导航_[所有网址]

篮球外围下注_篮球投注导航_[所有网址]是该公司为打造信誉第一,2014最新体验金,篮球外围下注_篮球投注导航_[所有网址]这里的所有老虎机游戏及真人百家乐游戏都具有欧洲风格,致力成为最具传播力和互动性的娱乐城网站。

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

2019-08-21 13:42 来源:未知

前言

出处:

主题素材陈述

前几日在练习写贰个小例子的时候使用了沙漏,开掘在setInterval和setTimeout中盛传函数时,函数中的this会指向window对象,如下例:

var num = 0;
function Obj (){
    this.num = 1,
    this.getNum = function(){
        console.log(this.num);
    },
    this.getNumLater = function(){
        setTimeout(function(){
            console.log(this.num);
        }, 1000)
    }
}
var obj = new Obj; 
obj.getNum();//1  打印的是obj.num,值为1
obj.getNumLater()//0  打印的是window.num,值为0

Js是二个单线程语言,能够经过setTimeout()和setInterval()来设置代码在指按期刻运营,前面四个是在指按期期后实行,前者是指每隔一段时间实行。两个的施用格局类似。

今天在演习写二个小例子的时候利用了停车计时器,开采在setInterval和setTimeout中流传函数时,函数中的this会指向window对象,如下例:

标题由来

从上述例子中得以见到setTimeout中函数内的this是指向了window对象,那是由于setTimeout()调用的代码运行在与所在函数一心分开的实行意况上。那会导致那个代码中饱含的 this 关键字会指向 window (或全局)对象。详细可参照MDN setTimeout

近些日子在演习写三个小例子的时候利用了电磁打点计时器,开采在setInterval和setTimeout中传唱函数时,函数中的this会指向window对象,详细的介绍通过贰个演示打开,一齐来看看啊。

美洲杯竞猜网址 1

消除措施

若想要让set提姆eout中的this指向正确的值,能够行使以下两种比较常用的点子来使this指向准确的值:

1.将近日指标的this存为一个变量,电磁打点计时器内的函数利用闭包来访谈那些变量,如下:

var num = 0;
function Obj (){
    var that = this;    //将this存为一个变量,此时的this指向obj
    this.num = 1,
    this.getNum = function(){
        console.log(this.num);
    },
    this.getNumLater = function(){
        setTimeout(function(){
            console.log(that.num);    //利用闭包访问that,that是一个指向obj的指针
        }, 1000)
    }
}
var obj = new Obj; 
obj.getNum();//1  打印的是obj.num,值为1
obj.getNumLater()//1  打印的是obj.num,值为1

 

这种艺术是将日前目的的援引位于一个变量里,反应计时器内部的函数来访谈到那几个变量,自然就足以拿到当前的靶子。

2.利用bind()方法

var num = 0;
function Obj (){
    this.num = 1,
    this.getNum = function(){
        console.log(this.num);
    },
    this.getNumLater = function(){
        setTimeout(function(){
            console.log(this.num);
        }.bind(this), 1000)    //利用bind()将this绑定到这个函数上
    }
}
var obj = new Obj; 
obj.getNum();//1  打印的为obj.num,值为1
obj.getNumLater()//1  打印的为obj.num,值为1

 

美洲杯竞猜网址,bind()方法是在Function.prototype上的一个情势,当被绑定函数推行时,bind方法会成立二个新函数,并将率先个参数作为新函数运营时的this。在那几个事例中,在调用setTimeout中的函数时,bind方法制造了二个新的函数,并将this传进新的函数,实施的结果也正是情有可原的了。关于bind方法可参谋 MDN bind

  1. 箭头函数

 

var num = 0;
function Obj (){
    this.num = 1,
    this.getNum = function(){
        console.log(this.num);
    },
    this.getNumLater = function(){
        setTimeout(() => {
            console.log(this.num);
        }, 1000)    //箭头函数中的this总是指向外层调用者,也就是Obj
    }
}
var obj = new Obj; 
obj.getNum();//1  打印的是obj.num,值为1
obj.getNumLater()//1  打印的是obj.num,值为1

 

ES6中的箭头函数完全修复了this的针对,this总是指向词法功效域,也正是外围调用者obj,由此利用箭头函数即可轻巧消除那个难题。

如上三种方法都是相比常用的,当然假诺选用call或apply方法来取代bind方法,获得的结果也是合情合理的,不过call方法会在调用之后立时实践,那样也就未有了延时的功用,反应计时器也就不曾用了,所以推举使用上述措施来将this传进setTimeout和setInterval中。 

如下例:

var num = 0;
function Obj (){
    this.num = 1,
    this.getNum = function(){
        console.log(this.num);
    },
    this.getNumLater = function(){
        setTimeout(function(){
            console.log(this.num);
        }, 1000)
    }
}
var obj = new Obj; 
obj.getNum();//1  打印的为obj.num,值为1
obj.getNumLater()//0  打印的为window.num,值为0
var num = 0;
function Obj (){
 this.num = 1,
 this.getNum = function(){
 console.log(this.num);
 },
 this.getNumLater = function(){
 setTimeout(function(){
  console.log(this.num);
 }, 1000)
 }
}
var obj = new Obj; 
obj.getNum();//1  打印的为obj.num,值为1
obj.getNumLater()//0  打印的为window.num,值为0

美洲杯竞猜网址 2

从上述例子中得以看到setTimeout中等高校函授数内的this是指向了window对象,那是由于setTimeout()调用的代码运转在与所在函数完全分离的施行蒙受上. 那会招致这么些代码中隐含的 this 关键字会指向 window (或全局)对象。详细可参看MDN setTimeout

从上述例子中能够观望set提姆eout中等学校函授数内的this是指向了window对象,那是出于setTimeout()调用的代码运行在与所在函数一起分离的试行遇到上. 那会形成那几个代码中满含的 this 关键字会指向 window (或全局)对象。详细可参看MDN setTimeout

然则在setTimeout中传播的不是函数时,this则针对当前目的,如下例:

不过在setTimeout中传来的不是函数时,this则指向当前目的,如下例:

var num = 0;
function Obj (){
 this.num = 1,
 this.getNum = function(){
 console.log(this.num);
 },
 this.getNumLater = function(){
 setTimeout(console.log(this.num), 1000)
 }
}
var obj = new Obj; 
obj.getNum();//1  打印的为obj.num,值为1
obj.getNumLater()//1  打印的为obj.num,值为1

美洲杯竞猜网址 3

从以上四个例证能够观看,当在setTimeout中传唱的参数为函数时,函数内部的this才会指向window对象。

var num = 0;
function Obj (){
    this.num = 1,
    this.getNum = function(){
        console.log(this.num);
    },
    this.getNumLater = function(){
        setTimeout(console.log(this.num), 1000)
    }
}
var obj = new Obj; 
obj.getNum();//1  打印的为obj.num,值为1
obj.getNumLater()//1  打印的为obj.num,值为1
TAG标签: 篮球外围下注
版权声明:本文由篮球外围下注发布于系统,转载请注明出处:关于setInterval和setTImeout中的this指向问题