drawImage无法正常工作

Question

我有一个具有构造函数的Sprite原型......

function Sprite(img) {
    for (var property in img) this[property] = image[property];
}

...接受一个I​​mage对象并复制它。现在我尝试使用drawImage绘制Sprite：

Sprite.prototype.draw = function(ctx, x, y) {
    ctx.drawImage(this, x, y);
}

这给了我一个错误：

Uncaught TypeError: Failed to execute 'drawImage' on 'CanvasRenderingContext2D': No function was found that matched the signature provided.

但是，如果我使用实际的Image对象，则使用相同的精确代码，即：

Sprite.prototype.draw = function(ctx, x, y) {
    ctx.drawImage(img, x, y);
}

它完全正常工作（img是Image对象的全局名称）。

这是Sprite原型的完整代码。我不明白导致这种情况发生的差异，因为我只将一个函数添加到Sprite中;绘制。

Answer 1

我怀疑你的意思是：

 this[property] = img[property]

除此之外，我认为你的副本比你需要的还要浅。查看此讨论，将原型方法放入您的副本中。 How do I correctly clone a JavaScript object?

最后我要提醒，除非你以某种方式改变图像，否则重用同一图像会更有效。让画布对象引用相同的图像。