Question

通过此教程，我从JS中编码了Snake：S https://medium.com/free-code-camp/think-like-a-programmer-how-to-build-snake-using-only-javascript-html-and-css-7b1479c3339e

但是我不太熟悉Canvas。

在两个函数中，一个用于碰撞，一个用于创建食物，下面的代码需要我解释：

function didGameEnd() {
    for (let i = 4; i < snake.length; i++) {
        if (snake[i].x === snake[0].x && snake[i].y === snake[0].y) return true
    }
    const hitLeftWall = snake[0].x < 0;
    const hitRightWall = snake[0].x > gameCanvas.width - 10;
    const hitToptWall = snake[0].y < 0;
    const hitBottomWall = snake[0].y > gameCanvas.height - 10;
    return hitLeftWall || hitRightWall || hitToptWall || hitBottomWall
}

在功能didGameEnd中，我想知道这代表什么： “ <0;” ＆“> gameCanvas.width-10;” ？我正在考虑画布的坐标，但是我找不到真正的答案。并且：

function createFood() {
    foodX = randomTen(15, gameCanvas.width - 10);
    foodY = randomTen(15, gameCanvas.height - 10);
    generate a new food location
    snake.forEach(function isFoodOnSnake(part) {
        const foodIsoNsnake = part.x == foodX && part.y == foodY;
        if (foodIsoNsnake) createFood();
    });
}

对于createFood，它的“ gameCanvas.width-10”也是如此，为什么它说15之前呢？

JS中的画布坐标和碰撞（Snake）

0 个答案: