【问题标题】:I have no idea why im getting a "undefined is not a function" error我不知道为什么我得到“未定义不是函数”错误
【发布时间】:2014-09-09 06:36:00
【问题描述】:

所以我不知道为什么,在第 35 行,我收到此错误,有人可以解释为什么这不起作用,因为我似乎无法弄清楚为什么?

这是其上传网页的链接,您可以在控制台中看到错误消息以及所有代码。 http://matthew-hoyle.co.uk/files/beta/projects/platformer.php

window.onload = function() {
var canvas = document.getElementById("canvas");
var c = canvas.getContext("2d");

canvas.width  = 800;
canvas.height = 600;

function Player() {
    this.width = 20;
    this.height = 20;
    this.color = "red";
    this.posY = (canvas.height / 2) - (this.height / 2);
    this.posX = (canvas.width / 2) - (this.width / 2);
    this.volY = 0;
    this.volX = 0;
    this.gravity = 0.5;
    this.onGround = true;
    this.draw = function() {this.posY += this.volY;
        this.posX += this.volX;
        this.volY += this.gravity;

        c.fillStyle = this.color;
        c.fillRect(this.posX, this.posY, this.width, this.height);
    };
}

function Obstacle(x,y,w,h,c) {
    this.posY = y;
    this.posX = x;
    this.width = w;
    this.height = h;
    this.color = c;
    this.draw = function() {
        c.fillStyle = this.color;
        c.fillRect(this.posX, this.posY, this.width, this.height);
    };
}

//objects
var player = new Player();
var ground = new Obstacle(0, canvas.height-20,canvas.width,20,"red");

//game update loop
window.setInterval(function() {
    //clears screen
    c.fillStyle = "lightblue";
    c.fillRect(0,0, canvas.width, canvas.height);

    //drawing objects
    player.draw();
    ground.draw();
}, 30);

};

【问题讨论】:

  • 您介意在您的代码中指出问题所在吗?
  • 复制案例:x = undefined; x()。所以找出(使用调试器并检查堆栈跟踪/完整错误消息)哪个表达式未定义并且被错误地尝试作为函数调用。然后修复它,使其不是未定义的。

标签: javascript html canvas undefined


【解决方案1】:
var ground = new Obstacle(0, canvas.height-20,canvas.width,20,"red");

在这里,您将 ground 初始化为具有 5 个参数的 Obstacle。第五个c 是字符串"red"。因此,当您稍后调用 ground.draw() 时,您正在尝试调用 "red".fillRect,这不是字符串的有效成员函数。

根本问题是Obstacle 构造函数的参数c 隐藏了全局c 变量,因为它的范围更近,因此隐藏了您打算使用的画布上下文引用。

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2019-11-12
    • 1970-01-01
    • 2018-10-03
    相关资源
    最近更新 更多