javascript - 为什么我的实例的属性未定义？

Question

这个问题已经有答案了:

Creating objects in JS (1 个回答)

已关闭 8 年前。

这是一个用于在页面上渲染动画的脚本，我正在完成this tutorial 。我定义了一个 Sprite 类，然后创建了一个名为 coin 的实例，但 coin 的属性似乎没有定义。调试器在尝试运行 coin.render() 时说我的上下文未定义，但我看不出我的实例化有什么问题。

如果需要，我可以提供 html 或图像。

window.onload = function () {

var spriteSheet = new Image();
spriteSheet.src = "spriteSheet.jpg";

//define sprite class

function sprite(options) {

    var that = {};

    this.context = options.context;
    this.width = options.width;
    this.height = options.height;
    this.image = options.image;

    that.render = function() {

        that.context.drawImage(
            that.image,
            0,
            0,
            that.width,
            that.height,
            0,
            0,
            that.width,
            that.height
        );

    }

    return that;

}

var canvas = document.getElementById("coinAnimation");
canvas.width = 100;
canvas.height = 100;

var coin = sprite({
        context: canvas.getContext("2d"),
        width: 100,
        height: 100,
        image: spriteSheet
});

//alert(coin.width);

coin.render();

}

Answer 1

据我所知，唯一的问题是这行:

var coin = sprite({

应该是

var coin = new sprite({

第一个告诉 JavaScript 将构造函数作为函数执行。第二个告诉 JS 创建一个新实例。

此外，变量 that 是一个空对象。您需要将其分配为 this 而不是 {}