var canvas = document.getElementById("canvas"); var ctx = canvas.getContext("2d"); // 在這裡編寫您的遊戲程式碼 var canvas = document.getElementById("canvas"); var ctx = canvas.getContext("2d"); var snake = { body: [{ x: 10, y: 10 }], direction: "right" }; var food = { x: 0, y: 0, appear: function() { this.x = Math.floor(Math.random() * 20) * 25; this.y = Math.floor(Math.random() * 20) * 25; } }; function drawSnake() { ctx.fillStyle = "green"; snake.body.forEach(function(bodyPart) { ctx.fillRect(bodyPart.x * 25, bodyPart.y * 25, 25, 25); }); } function drawFood() { ctx.fillStyle = "red"; ctx.fillRect(food.x, food.y, 25, 25); } function moveSnake() { var head = snake.body[0]; var newHead = { x: head.x, y: head.y }; switch (snake.direction) { case "up": newHead.y -= 1; break; case "down": newHead.y += 1; break; case "left": newHead.x -= 1; break; case "right": newHead.x += 1; break; } snake.body.unshift(newHead); snake.body.pop(); } function checkCollision() { var head = snake.body[0]; // 碰到邊界 if (head.x < 0 || head.x > 19 || head.y < 0 || head.y > 19) { return true; } // 碰到自己 for (var i = 1; i < snake.body.length; i++) { if (head.x === snake.body[i].x && head.y === snake.body[i].y) { return true; } } return false; } function checkFood() { var head = snake.body[0]; if (head.x === food.x / 25 && head.y === food.y / 25) { food.appear(); snake.body.push({}); } } function update() { moveSnake(); if (checkCollision()) { clearInterval(interval); alert("Game Over!"); return; } checkFood(); ctx.clearRect(0, 0, canvas.width, canvas.height); drawSnake(); drawFood(); } food.appear(); var interval = setInterval(update, 100);