1

我浏览了这个问题的许多其他答案,无法找到答案。

问题似乎是它没有在我的 game.js 文件中识别 World 全局。

html文件的顺序正确

<script src="js/world.js"></script>
<script src="js/game.js"></script>

IN world.js -- 这个构造函数应该可以工作,因为它与我的其他构造函数相似

var World = function(){

    var draw = function(ctx) {
        ctx.drawImage(bg1, 100, 100);
    };
}; 

IN game.js——罪魁祸首可能在这里

请注意,下面这两个函数都没有嵌套在任何东西中:

var World;

function init() {
    // Declare the canvas and rendering context
    canvas = document.getElementById("gameCanvas");
    ctx = canvas.getContext("2d");
    localPlayer = new Player(startX, startY); //WORKS CORRECTLY
    World = new World(); //SHOULD ALSO WORK CORRECTLY

……………………………………………………………………………………………………………………

在 init 函数之外是

function draw() {
    // Wipe the canvas clean
    ctx.clearRect(0, 0, canvas.width, canvas.height);

    World.draw(ctx);
    // Draw the local player

    // Draw the remote players
    var i;
    for (i = 0; i < remotePlayers.length; i++) {
        remotePlayers[i].draw(ctx);
    };
    localPlayer.draw(ctx);
};

在 World.draw(ctx) 是我得到错误的地方

Uncaught TypeError: Object [object Object] has no method 'draw' game.js:202 draw

如果您需要更多详细信息,我很乐意提供帮助。我会发布我所有的代码,只是它非常大。

4

2 回答 2

0

如果您将draw()其用作实例方法,则应将其定义为:

var World = function(){

    this.draw = function(ctx) {
        ctx.drawImage(bg1, 100, 100);
    };

}; 

this关键字允许在对象之外引用函数World

使用var将可见性限制在 functionWorld的范围内。

于 2013-09-16T23:24:32.727 回答
0

如果您需要 的多个实例World,那么您将需要让您的构造函数将函数导出为属性(在 上this) - 请参阅Javascript:我需要为对象中的每个变量放置 this.var 吗?对于私有变量的差异。并且不要将您的实例写入与构造函数相同的变量。

function World(){
    this.draw = function(ctx) {
        ctx.drawImage(bg1, 100, 100);
    };
}

var world, ctx;
function init() {
    // Declare the canvas and rendering context
    var canvas = document.getElementById("gameCanvas");
    ctx = canvas.getContext("2d");

    world = new World(ctx);

    …
}

function draw() {

    world.draw(ctx);

    …
}

但是,如果您只需要一个静态模块(单例),请忘记初始化,只需使用您分配给World它的对象文字,然后将其用作命名空间。这就是@fahadash 的建议:

World = {
    draw: function(ctx) {
        ctx.drawImage(bg1, 100, 100);
    }
};

var ctx;
function init() {
    // Declare the canvas and rendering context
    var canvas = document.getElementById("gameCanvas");
    ctx = canvas.getContext("2d");

    // no World initialisation here! Do not try to call `new World`!

    …
}

function draw() {

    World.draw(ctx);

    …
}
于 2013-09-16T23:27:34.483 回答