Workshop › Candy Crush-style Match 3 › Step 13 of 29

Clear the match

What we are doing

After a matching swap the matched gems disappear, 10 points each. An empty cell is marked -1, which is no color; findMatches and draw skip empty cells.

```js
let board // board[row][col]: a color index, or -1 while empty

      const gem = board[r][c]
      if (gem < 0) continue

  const matched = findMatches()
  score += matched.size * 10
  for (const cell of matched) board[Math.floor(cell / N)][cell % N] = -1
```

What it means

• trySwap, after a swap that matches: 10 points per matched gem, then every matched cell becomes -1.
• A cell number turns back into a row with Math.floor(cell / N) and a column with cell % N.
• if (gem < 0) continue skips empty cells in both findMatches and the drawing loop.

Your turn

1. Update the comment of let board.
2. In findMatches, under const gem = board[r][c], write if (gem < 0) continue.
3. In trySwap, above the last return true, write the three lines.
4. In draw, under const gem = board[r][c], write if (gem < 0) continue too.

Skills: Arrays and objects, Game states

← A score and a fresh start Let the gems fall →

All steps

1. A place for the board
2. A checkered grid
3. The game loop
4. A board of random gems
5. Draw the gems
6. Start without matches
7. Click a gem
8. Show the selection
9. Swap two neighbours
10. Find every match
11. No match, no swap
12. A score and a fresh start
13. Clear the match
14. Let the gems fall
15. Two halves of a clear
16. Wait before clearing
17. Flash, and hands off
18. Cascades
19. Where a gem came from
20. Slide down
21. Out from under the top
22. Is there any move?
23. Never stuck
24. A hint after five seconds
25. Show the hint
26. Twenty moves
27. The end of a game
28. Remember the best score
29. Build it yourself: swipe to swap