Javascript 使用'；这'；对象构造函数中的变量

在对象构造函数中调用'this'变量时，我对得到的结果有点困惑

function Slider(tag){
    this.tag = document.querySelector(tag),
    this.start = function(){
        return this.interval;
    },
    this.interval = setInterval(function(){
        console.log(this.tag); //undefined
        console.log(this); //window object
    }, 2000)
}
var route ={
    init:function(){        
        mySlide = new Slider('slider');
        mySlide.start();
    }
}
document.addEventListener('DOMContentLoaded', route.init);

我正在记录tag

console.log（this.tag）

但是它返回

undefined

，并且在

console.log（this）

中记录

this

变量时，它引用窗口对象

---

问题：为什么

console.log（this.tag）

不返回所选元素？

setInterval中匿名函数的作用域是窗口。 如果希望它成为滑块实例，则应首先创建它

function Slider(tag){
this.tag = document.querySelector(tag),
this.start = function(){
    return this.interval;
},
this.interval = setInterval(function(){
    console.log(this.tag); //undefined
    console.log(this); //window object
}.bind(this), 2000)
}

---

这是因为当您将回调函数传递给

setInterval

时，它在全局范围内被调用。这就是为什么

这个

是

窗口

您可以使用将函数的上下文设置为

此

对象，并使其按您的需要工作

this.interval = setInterval(function(){
    console.log(this.tag);
}.bind(this), 2000);

另外，我只想指出

mySlide.start（）什么也不做。当您调用
newslider（“Slider”）
时，即设置了间隔。您的
mySlide.start（）
只返回intervalID（仅用于
clearInterval（）
）。实际上，因为您甚至没有使用
mySlide.start（）的返回值，调用它是无用的

更新：另一个解决方案是使用
var self=this，然后在
setInterval（）内使用
self
：

更新：如果您使用的浏览器支持以下操作：

this.interval = setInterval(() => {
    console.log(this.tag);
}, 2000);

回调函数不会从周围的作用域继承此
。您可以使用
bind
或分配变量
var self=this在周围的范围内。词法范围，仔细阅读。啊，我很好，是的
bind
works，我只是想说。。。因此，我希望能够清除间隔，但需要将
setInterval
设置为一个变量，以便能够清除它。有没有更好的方法可以用来
.start（）
和
.clear（）
？@jordavis:我希望
.start（）
是调用
setInterval（）
的方法。Have
.start（）
do
this.interval=setInterval（函数（）{…}）
，这样你就可以有一个
.clear（）
do
clearInterval（这个.interval）。现在，你的
.start（）
实际上并没有启动任何东西。真是太棒了！这是使用
bind
方法的典型/标准方法吗？@jordavis：是的，这是一种方法。这很正常。另一种方法是这样做
var self=this
位于
滑块的最顶端。然后在
setInterval（）
中使用
self.tag
。哦，不，我知道
这个
变量的范围在两者之间发生了变化。我通常不会用这种方式创建对象，所以有点困惑。
this.interval = setInterval(() => {
    console.log(this.tag);
}, 2000);