Question

作为一个非常喜欢编程的人，我决定尝试编写一个蛇游戏。我遇到了一个问题，如果蛇向右移动，而不是向其他方向移动，那么蛇就会以我想要的方式移动。我知道如何解决我的问题，但我认为这将是不必要的混乱。

无论如何，这里是相关部分。

const createSnake = () => {
    const snakeLength = Settings.getSnakeLength();

    for (let snakeIndex = 0; snakeIndex < snakeLength; snakeIndex++) {
        snake.push({xPosition: Settings.getUnitSize() * 5 + snakeIndex * Settings.getUnitSize(), 
                    yPosition: Settings.getUnitSize() * 5});
    }
};

createSnake只是初始化蛇形数组，因此它是一个xPos＆amp;数组。 yPos对象，每个数组元素代表蛇的一个单元格。 xPos和yPos乘以蛇索引和单元格大小的原因是因为蛇最初面向右边创建。

const drawSnake = () => {
    for (let snakeIndex = 0; snakeIndex < snake.length; snakeIndex++) {
        context.fillRect(snake[snakeIndex].xPosition, 
                         snake[snakeIndex].yPosition, 
                         Settings.getUnitSize(), 
                         Settings.getUnitSize());
    }
};

所有drawSnake都会绘制蛇，因为它最初是在createSnake中创建的。 createSnake和drawSnake都只在我的游戏中调用一次。

const moveSnake = () => {
    if (context.fillStyle !== "#000000") {
        context.fillStyle = "#000000";
    }

    let direction = "right";
    let oldTailNewHead = snake[0];

    // Fix Below
    if (direction === "right") {
        oldTailNewHead.xPosition += snake.length * Settings.getUnitSize();
    } else if (direction === "left") {
        //oldTailNewHead.xPosition -= snake.length * Settings.getUnitSize();
    } else if (direction === "down") {
        //oldTailNewHead.yPosition += snake.length * Settings.getUnitSize();
    } else if (direction === "up") {
        //oldTailNewHead.yPosition -= snake.length * Settings.getUnitSize();
    }

    snake.shift();
    snake.push(oldTailNewHead);

    context.fillRect(oldTailNewHead.xPosition, 
                     oldTailNewHead.yPosition, 
                     Settings.getUnitSize(), 
                     Settings.getUnitSize());

    context.clearRect(snake[0].xPosition - Settings.getUnitSize(),
                      snake[0].yPosition, 
                      Settings.getUnitSize(), 
                      Settings.getUnitSize());
};

这是我移动蛇的代码的一部分。每隔x ms使用SetInterval调用它。注释掉的部分在那里，因为我天真地认为它在我第一次写它时会起作用，但我现在看到它根本没有。我想在修复问题时尽可能保持程序的结构尽可能接近。感谢您的帮助。

编辑：我忘了添加我正在考虑的解决方案是保存前一个头部的位置并更新oldTailNewHead相对于前一个头部的位置。这项工作还可以吗？

编辑2：我还没有添加事件监听器和键输入来动态改变方向。假设我正在测试，通过手动更改代码中的方向字段来查看每个方向是否正常工作。

编辑3：究竟是什么问题？问题是它总是从左到右画蛇，即使方向不是正确的，甚至当我取消注释这些代码行时。行为会发生变化，但这不是预期的行为。例如，如果我向左方向改变方向，它会开始将蛇从左侧的当前蛇中拉出一条蛇的长度，然后一旦它完成了蛇的绘制，它就会开始画一条新的蛇，而另一条蛇又长了一条蛇。左边。所以基本上，它传送到左边，然后从左到右画蛇。

如果我将方向改为向下，它会开始在蛇的当前位置下方画一条新蛇，但同样，它会从左到右画出这条新蛇。

简而言之，方向会改变蛇开始绘制的位置。但是，蛇总是从左到右“填充”，直到它画出整个长度。一旦绘制了蛇的整个长度，它就会再次拍摄到由方向决定的新位置。

Javascript蛇游戏（方向问题）

0 个答案: