STEP 6 OF 7

Game state and score

Keep the game’s important facts in one small state object. That makes it clear when play begins, when a score changes, and when the game should stop.

const game = { score: 0, status: 'playing' };

function collectFood() { game.score += 10; }
function endGame() { game.status = 'game-over'; }

Next actions: build the Snake project · play Snake · browse reusable code

Before you continue

Direct answer: Keep score, lives, and the current game status in a small state object so restart and game-over behavior stay understandable.

What you need first

Input and collision basics.

After this lesson

You can explain the idea, change the supplied example, and choose the next related lesson.

When to use it

Use explicit states such as playing, paused, and game-over. Do not let unrelated flags decide the same behavior.

Common mistake

Resetting the display but leaving old positions or score values in memory.

Try it and check it

This lesson includes its runnable example or code experiment above. Change one value, run it again, and confirm the visible result changes before moving on.

Real game connection

Use the state checklist in the Snake project.

Compatibility: Test in a current Chrome, Firefox, Safari, or Edge browser. Canvas and standard input work broadly in current browsers; audio still needs a user action.

Source and update

Reviewed against MDN Web Docs. Updated 2026-07-14. This page does not claim performance results beyond the local example check.