为什么回调未定义？

Question

您好，我使用对象构造函数来管理一些动画，在某些情况下，我想在动画完成时传递一个回调以使其他一些元素出现。问题是如果在 if 语句中我记录了一种回调类型，它是一个有效的函数，但是当我在 if 语句中执行日志时，如果总是未定义，我很感激有人可以帮助我，我也离开了代码，所以你们可以检查一下。

// CONSTRUCTOR WHO MANAGE THE ANIMATIONS FOR THE WEBSITE

function SpriteAnimation(frameWidth, spriteWidth, spriteElement, shouldLoop, frameRate){
    this.frameWidth = frameWidth;
    this.spriteWidth = spriteWidth;
    this.selector = document.getElementById(spriteElement);
    this.shouldLoop = shouldLoop ;
    this.curPx = 0;
    this.frameRate = frameRate;
}

SpriteAnimation.prototype.start = function(callback){
    this.selector.style.backgroundPosition = "-" + this.curPx + "px 0px";
    this.curPx += this.frameWidth;

    if (this.curPx < (this.spriteWidth - this.frameWidth)){
        setTimeout(this.start.bind(this), this.frameRate);
    }else if (this.curPx > (this.spriteWidth - this.frameWidth)){
        console.log(typeof callback);
    }else if(this.shouldLoop){
        this.curPx = 0;
        this.start();
    }
};

稍后在代码中我实例化它并运行开始：

var letter = new SpriteAnimation(790, 18163, "letter", false, 53.3);

letter.start(function(){
    console.log("hola");
});

Answer 1

您没有在setTimeout 中传递回调，我建议您这样做：

    setTimeout(function(){
        this.start(callback);
    }, this.frameRate);

Answer 2

一种可能是 setTimeout 调用了 start 函数

SpriteAnimation.prototype.start = function(callback){
    this.selector.style.backgroundPosition = "-" + this.curPx + "px 0px";
    this.curPx += this.frameWidth;

    if (this.curPx < (this.spriteWidth - this.frameWidth)){
        setTimeout((function(){
            this.start(callback)
        }).bind(this), this.frameRate);
    }else if (this.curPx > (this.spriteWidth - this.frameWidth)){
        console.log(typeof callback);
    }else if(this.shouldLoop){
        this.curPx = 0;
        this.start();
    }
};