数组似乎在ProcessingJS中正常工作

时间:2015-11-19 09:55:23

标签: arrays processing processing.js

我目前正在制作一款游戏,并希望使用数组来绘制水平。

但是,似乎有一些错误会阻止程序实际绘制矩形。我已经在代码中找到了我能想到的每一个错误。我甚至尝试过重新学习KhanAcademy的阵列主题,但似乎没有什么能解决我的问题。所以我认为StackOverflow是我最后的选择。 You can see the game here,或者如果你只想看到纯代码,it can be found here,如果你认为我的网站会给你一个病毒,你可以在这里看到它:

    var sketchProc = function(processingInstance) {
    with (processingInstance) {
        size(400, 400);
        frameRate(60);      

        // Setup stuff 'n stuff
            noStroke();
            fill(0, 0, 0);
            var scene = 0;
            var controlsEnable = 0;
            var tufdasDebug = 0;
            var tufdasLeve;

        /* Key/control variables (JavaScript key codes:
        http://www.cambiaresearch.com/articles/15/javascript-char-codes-key-codes)*/
            var keyIsPressed = 0;
            var key_SHIFT = 16;
            var key_CTRL = 17;

        // Position & Size variables
            var jumperXPos = 100;
            var jumperYPos = 360;
            var jumperSize = 20;

        // Counters
            var jumperXCounter = 11;
            var jumperYCounter = 11;
            var shiftCounter = 11;

        keyPressed = function() {
            keyIsPressed = 1;
        };

        keyReleased = function() {
            keyIsPressed = 0;
            resetCounters();
        };

        var askForResolution = function() {
            text("What resolution do you want to play in?", 100, 15);
        };

        var addCounters = function(amount) {
            if (amount) {
                jumperXCounter += amount;
                jumperYCounter += amount;
                shiftCounter += amount;
            } else {
                jumperXCounter ++;
                jumperYCounter ++;
                shiftCounter ++;
            }
        };

        var resetCounters = function() {
            jumperXCounter = 11;
            jumperYCounter = 11;
            shiftCounter = 11;
        };
        var controlsHandler = function() {
            addCounters();

            if (tufdasDebug === 1) { console.log("Handling controls..."); }
            if (keyIsPressed === 1) {
                if (tufdasDebug === 1) { console.log("A key is being pressed..."); }
                if (controlsEnable === 0) {
                    if (tufdasDebug === 1) { console.log("Controls disabled..."); }
                    if (keyCode === key_SHIFT) {
                        if (tufdasDebug === 1) { console.log("Shift is being pressed."); }
                        scene ++;
                        controlsEnable = 1;
                    }
                } else if (controlsEnable === 1) {
                    if (keyCode === UP && jumperYCounter > 10) {
                        jumperYPos -= 20;
                        jumperYCounter = 0;
                    } else if (keyCode === RIGHT && jumperXCounter > 10) {
                        jumperXPos += 20;
                        jumperXCounter = 0;
                    }
                }
            }
        };

        var drawIntroSequence = function(y) {
            textSize(30);
            text("JUMPER", 125, y + 100);
            textSize(15);
            text("Press SHIFT or RSHIFT to continue...\n(make sure to click inside the game first)", 65, y + 300);
        };

        var drawJumper = function() {
            fill(0, 0, 255);
            rect(jumperXPos, jumperYPos, jumperSize, jumperSize);

        };

        var drawtufdasLevel = function() {
            fill(0, 0, 0);
            rect(tufdasLevel[0], tufdasLevel[1], tufdasLevel[2], tufdasLevel[3]);
            rect(tufdasLevel[4], tufdasLevel[5], tufdasLevel[6], tufdasLevel[7]);
        };






        draw = function() {
            background(255, 255, 255);
            if (scene === 0) {
                drawIntroSequence(0);
                var tufdasLevel = [0, 380, 400, 20, 0, 0, 400, 20]; // Space indicates a new command.
            } else if (scene === 1) {
                drawtufdasLevel();
                drawJumper();
            }
            controlsHandler();
        };
}};
var canvas = document.getElementById("tufdaDrawCanvas");
var processingInstance = new Processing(canvas, sketchProc);

1 个答案:

答案 0 :(得分:1)

要确切了解发生了什么,请在浏览器中打开游戏,按F12键,然后转到“控制台”标签,打开JavaScript控制台。

当你的游戏开始时,你会看到错误:

Uncaught TypeError: Cannot read property '0' of undefined at game.js:100

它告诉你错误发生在草图的第100行,就是这一行:

rect(tufdasLevel[0], tufdasLevel[1], tufdasLevel[2], tufdasLevel[3]);

现在您知道tufdasLevel变量出了问题。让我们看看你声明的位置。你在第12行有一个:

var tufdasLevel;

这是你的声明,但你的初始化在哪里?你有一个,一行118:

var tufdasLevel = [0, 380, 400, 20, 0, 0, 400, 20]; // Space indicates a new command.

阿公顷!请注意您如何使用 var 关键字来声明名为tufdasLevel另一个变量。这是与草图顶部的变量不同的变量,它是第100行使用的变量。第118行的tufdasLevel变量从未使用,第12行的tufdasLevel 从未初始化。因此,当您的游戏尝试使用未初始化的变量时,您会收到错误。

似乎您打算初始化第118行的变量,不声明。尝试从第118行删除var关键字:

tufdasLevel = [0, 380, 400, 20, 0, 0, 400, 20]; // Space indicates a new command.

您也可以将初始化放在第12行。