科学教育

标题: js [打印本页]
作者: 张葉彬    时间: 2025-11-11 09:38
标题: js
const gridSize = 20;
let snake = [{x: 200, y: 200}];
let food = {x: 0, y: 0};
let dx = gridSize;
let dy = 0;
let score = 0;

function drawSnake() {
    context.clearRect(0, 0, canvas.width, canvas.height);
    snake.forEach(part => {
        context.fillStyle = "green";
        context.fillRect(part.x, part.y, gridSize, gridSize);
    });
}

function generateFood() {
    food.x = Math.floor(Math.random() * canvas.width / gridSize) * gridSize;
    food.y = Math.floor(Math.random() * canvas.height / gridSize) * gridSize;
}

function drawFood() {
    context.fillStyle = "red";
    context.fillRect(food.x, food.y, gridSize, gridSize);
}

function moveSnake() {
    const head = {x: snake[0].x + dx, y: snake[0].y + dy};
    snake.unshift(head);
    if (head.x === food.x && head.y === food.y) {
        score++;
        generateFood();
    } else {
        snake.pop();
    }
}

function changeDirection(event) {
    const keyPressed = event.keyCode;
    if (keyPressed === 37 && dx === 0) {
        dx = -gridSize;
        dy = 0;
    }
    if (keyPressed === 38 && dy === 0) {
        dx = 0;
        dy = -gridSize;
    }
    if (keyPressed === 39 && dx === 0) {
        dx = gridSize;
        dy = 0;
    }
    if (keyPressed === 40 && dy === 0) {
        dx = 0;
        dy = gridSize;
帮我写注释在贪吃蛇代码里

作者: kaia    时间: 2025-11-11 09:38
当我们在编程时，通过添加注释可以帮助我们更好地理解代码的功能和逻辑。下面是为贪吃蛇游戏代码添加注释的示例：

  1. const gridSize = 20; // 定义方格大小
  2. let snake = []; // 初始化蛇身数组
  3. let food = {x: 0, y: 0}; // 初始化食物位置
  4. let dx = gridSize; // x轴移动距离
  5. let dy = 0; // y轴移动距离
  6. let score = 0; // 分数

  8. function drawSnake() {
  9.     context.clearRect(0, 0, canvas.width, canvas.height); // 清空画布
  10.     snake.forEach(part => {
  11.         context.fillStyle = "green";
  12.         context.fillRect(part.x, part.y, gridSize, gridSize); // 绘制蛇身
  13.     });
  14. }

  16. function generateFood() {
  17.     food.x = Math.floor(Math.random() * canvas.width / gridSize) * gridSize; // 随机生成食物的x坐标
  18.     food.y = Math.floor(Math.random() * canvas.height / gridSize) * gridSize; // 随机生成食物的y坐标
  19. }

  21. function drawFood() {
  22.     context.fillStyle = "red";
  23.     context.fillRect(food.x, food.y, gridSize, gridSize); // 绘制食物
  24. }

  26. function moveSnake() {
  27.     const head = {x: snake[0].x + dx, y: snake[0].y + dy}; // 获取蛇头位置
  28.     snake.unshift(head); // 在蛇头位置添加新的蛇身
  29.     if (head.x === food.x && head.y === food.y) { // 如果吃到食物
  30.         score++; // 分数加一
  31.         generateFood(); // 生成新的食物
  32.     } else {
  33.         snake.pop(); // 否则删除蛇尾
  34.     }
  35. }

  37. function changeDirection(event) {
  38.     const keyPressed = event.keyCode;
  39.     if (keyPressed === 37 && dx === 0) { // 左箭头键
  40.         dx = -gridSize;
  41.         dy = 0;
  42.     }
  43.     if (keyPressed === 38 && dy === 0) { // 上箭头键
  44.         dx = 0;
  45.         dy = -gridSize;
  46.     }
  47.     if (keyPressed === 39 && dx === 0) { // 右箭头键
  48.         dx = gridSize;
  49.         dy = 0;
  50.     }
  51.     if (keyPressed === 40 && dy === 0) { // 下箭头键
  52.         dx = 0;
  53.         dy = gridSize;
  54.     }
  55. }
复制代码


通过以上注释，我们可以清晰地了解每个函数的作用以及代码中重要的变量。这有助于我们更好地理解代码并进行必要的调试和修改。希望以上注释能帮助你更好地理解贪吃蛇游戏代码！



欢迎光临 科学教育 (http://www.sci-edu.net/) Powered by Discuz! X3.2