问

JavaScript - 从另一个原型函数调用原型的函数？

轻淞猪发布于 2023-02-13 17:12

java

我正在尝试使用纯JavaScript编写一个简单的滑块.由于这些是我使用对象原型并遵循面向对象方法的第一步,有时候我很困惑,所以请耐心等待.

这是我有的:

function MySlider(noOfSlides, startSlide){
    this.noOfSlides = noOfSlides;
    this.startSlide = startSlide;
    this.currentSlide = this.startSlide;
}

MySlider.prototype.nextSlide = function(){
    this.currentSlide++;
    console.log(this.currentSlide);
    return this.currentSlide;
};

MySlider.prototype.startSlider = function(){
    setInterval(function(){
        MySlider.nextSlide();
    }, 2000);
};

var slides = new MySlider(4, 1);

document.getElementById("button").addEventListener("click", function(){
    slides.startSlider();
}, false);

不幸的是,这是行不通的,经过2秒等待因为setInterval,我得到以下错误:TypeError: MySlider.nextSlide is not a function.

虽然我明白问题是什么,但我不知道该改变什么.我已经试过了this.nextSlide()但是那也没用.我的猜测是它与原型链有关,但我仍然试图理解这一点.

如何解决这个问题呢？或者这样一般来说这是一个坏主意吗？

1 个回答

this设置计时器处理程序时,需要保留上下文(值):
```
MySlider.prototype.startSlider = function(){
    var slider = this;
    setInterval(function(){
        slider.nextSlide();
    }, 2000);
};
```
通过保存值this,可以确保当间隔计时器关闭时,它将能够在正确的对象的上下文中调用"nextSlide"函数.
2023-02-13 17:13 回答

Melix7

撰写答案

今天，你开发时遇到什么问题呢？

立即提问

热门标签