为什么在这个函数中没有定义“sprite”？ [复制]答案

【问题标题】：Why isn't "sprite" defined inside this function? [duplicate]为什么在这个函数中没有定义“sprite”？ [复制]
【发布时间】：2013-05-11 23:17:13
【问题描述】：

有问题的小提琴：http://jsfiddle.net/dqDAv/2/

在第 146 行，我在方法 render() 中将对象 "Player" 作为 sprite 的参数传入

对象

var player = new Sprite({
    'left': spriteLeftAnim,
    'right': spriteRightAnim
}, 'right', canvas.width / 2, canvas.height / 2, 44, 108, 100);

方法

function Render() {
ctx.clearRect(0,0, 500, 500);
ctx.beginPath();
ctx.moveTo(0,400);
ctx.lineTo(500,400);
ctx.stroke();
ctx.closePath();
ctx.stroke(); 
drawSprite(player); // <- Parameter
}

那么，为什么sprite 没有定义在：

function drawSprite(sprite) {
ctx.drawImage(
    sprite.stateAnimations[sprite.currentState].tileset.image, 
    sprite.stateAnimations[sprite.currentState].frames[sprite.stateAnimations[sprite.currentState].currentFrame].split(',')[0] * sprite.stateAnimations[sprite.currentState].tileset.tileWidth,
    sprite.stateAnimations[sprite.currentState].frames[sprite.stateAnimations[sprite.currentState].currentFrame].split(',')[1] * sprite.stateAnimations[sprite.currentState].tileset.tileHeight,
    sprite.stateAnimations[sprite.currentState].tileset.tileWidth,
    sprite.stateAnimations[sprite.currentState].tileset.tileHeight,
    Math.round(sprite.x),
    Math.round(sprite.y),
    sprite.width,
    sprite.height
);
}

【问题讨论】：

不要发布这样的重复内容。您可以编辑之前的问题以添加额外的详细信息。
然而，这是一个完全不同的小提琴。我在这里谈论一个错误，这是因为未定义精灵而引起的（所以我试图辨别其他小提琴的做法与我所做的不同，但没有得到答案）。我尝试使用另一个小提琴来获得关于如何定义精灵的答案，所以我可以自己解决问题，但由于“精灵”本身似乎不是问题，我不知所措并尝试使用我的代码有问题。我发布这个只是因为我之前的问题和 javascript 聊天框都帮不上忙。
对不起，如果它看起来像重复，这不是我的意图。
初始错误是因为您在创建player 对象之前调用Loop() 开始动画。将Loop()移动到最后：jsfiddle.net/dqDAv/3
好吧，下一个是在您的Update() 函数中，您引用了一个未定义的变量sprite - 您可能打算使用player。

标签： javascript html canvas undefined typeerror

【解决方案1】：

这是因为你在初始化“player”之前调用了“Loop()”。

使用 Chrome 调试器甚至 console.log() 调用之类的东西非常容易解决此类问题。您只需要从代码中发现事情不是您所期望的那一点向后工作。在这种情况下，这就是您调用“drawSprite()”的地方。如果“sprite”未定义，那么这一定意味着传入的任何内容都是未定义的——变量“player”。所以在“player”初始化的地方放一个断点，在调用“drawSprite()”之前放一个断点。以此类推。

【讨论】：

感谢您的帮助