Question

我知道这似乎有些重复，但事实并非如此。我正在尝试使用OOP方法创建一个简单的Slider。所以这就是我到目前为止所做的：

function Slider(){
    this.totalSlides = 3;
    this.sliderImagesRoot = 'images/slider/';
    this.imagesLinks = [this.sliderImagesRoot + '1.png',this.sliderImagesRoot + '2.png',this.sliderImagesRoot + '3.png'];
    this.titles = ['State of the Art', 'Best staff kk', 'Toratos'];
    this.descriptions = ['First description, bla bla bla', 'werewr','Toraki']; 
    this.slideDelay = 1200;
    this.currSlide = 1;

    this.initSlider = function(){
        var createSlide = this.createSlide();
        var sliding = setInterval(function(createSlide){
            createSlide();
        }, 500);

    }

    this.createSlide = function(){
            alert("er");  
    }
}

我认为它与传入函数，任何想法有关？这是我第一次尝试在JS中实现OOP。

Answer 1

您不需要为对象创建单独的构造函数方法（代码中为initSlider），函数Slider本身就是构造函数。尝试这样的事情：

function Slider(){
    this.totalSlides = 3;
    this.sliderImagesRoot = 'images/slider/';
    this.imagesLinks = [this.sliderImagesRoot + '1.png',this.sliderImagesRoot + '2.png',this.sliderImagesRoot + '3.png'];
    this.titles = ['State of the Art', 'Best staff kk', 'Toratos'];
    this.descriptions = ['First description, bla bla bla', 'werewr','Toraki']; 
    this.slideDelay = 1200;
    this.currSlide = 1;

    var createSlide = function(){
            alert("er");  
    }
    var sliding = setInterval(function(){
        createSlide();
    }, 500);


}

然后你可以像这样构造对象：

var slider = new Slider();

Answer 2

redneb的答案应该是您需要继续的，但我想指出一些可能有用的东西。而不是一些单独的列表（links，titles，descriptions）和一个独立的计数器，所有这些都需要保持同步，存储数据会更加清晰在这样一个简单的结构中：

var slides = [
    {linK: '1.png', title: 'State of the Art', desc: 'First description,...'},
    {link: '2.png', title: 'Best staff kk',    desc: 'werewr'},
    {link: '3.png', title: 'Toratos',          desc: 'Toraki'}
];

然后，您可以将totalSlides导出为slides.length，当您使用link属性时，可以添加sliderImagesRoot。

Answer 3

setInterval回调按预期调用 - 但是，在回调中，您试图调用作为参数传递的函数，并且您没有传递任何内容，因此它将是未定义的。

如果您运行代码，您应该会看到一条错误消息：

TypeError: createSlide is not a function

setInterval只触发一次

3 个答案: