Workshop › Angry Birds-style Slingshot › Step 24 of 47

A level as data

What we are doing

A level is just data: a list of rows [kind, x, y, width, height]. reset turns each row into a body with map. Two posts, a beam across them and a stone block.

```js
// The level: [kind, x, y, width, height], x and y the top left corner.
const LEVEL = [
  ['wood', 380, 230, 12, 60], ['wood', 440, 230, 12, 60], ['wood', 370, 218, 94, 12], ['stone', 480, 250, 40, 40],
]

  bodies = LEVEL.map(([kind, x, y, w, h]) => body(kind, x, y, w, h))
```

What it means

LEVEL is an array of arrays: each row describes one block.
map makes a new array by turning each item into something else: here each row into a body.
([kind, x, y, w, h]) => ... unpacks the five items of a row into five names.

Your turn

Under the MATERIALS block (after its }), write the comment and LEVEL.
In reset, replace bodies = [] with the map line.

Skills: Arrays and objects

← Wood and stone Push overlapping boxes apart →

All steps