# Up Next: Working with Data

See how much you can do after Module 1, meet the Rock, Paper, Scissors game where you'll show it, and get a first look at the lists and records Module 2 teaches.

Novice · JavaScript · Updated October 31, 2026

## After this lesson you can

- Describe what arrays and objects will let your programs do

## Key takeaways

- After Module 1 you can store values, make decisions, repeat work and package it in functions. That's enough to write a game.
- The Rock, Paper, Scissors project hands you a finished page. You write the game's rules in game.js.
- So far each variable holds one value. Module 2's arrays hold whole lists, such as a playlist, and its objects hold records, such as a pet's profile.
- Module 2 also teaches map and filter, which reshape a whole list in one line, using the arrow functions you know now.

At the start of this module, your first program printed one line of text. Look at what you can write now: programs that remember values, do the math, make decisions, repeat work, and package it all in functions with names. That's real programming, the same pieces every app on your phone is built from.

This lesson looks back at what you can do, shows you the game where you'll put it all together, and gives you a first look at Module 2, where your programs stop working with one value at a time and start working with whole lists of real data.

## What you can do now

After Module 1, you can:

- **run JavaScript** in Node and on a web page, and read an error message to find what went wrong;
- **keep values** in variables with `let` and `const`: numbers, text and true or false;
- **calculate** with numbers and **build text** with template literals;
- **make decisions** with `if`, `else`, `switch` and the conditional operator;
- **repeat work** with `while` and `for` loops;
- **package steps** in functions that take parameters and `return` a result, written as declarations or as arrow functions.

Here's a small program that uses nearly all of it at once:

```javascript
const goldScore = 1000;

function medalFor(score) {
  if (score >= goldScore) {
    return 'gold';
  }
  return score >= 500 ? 'silver' : 'bronze';
}

const roundLine = (round, score) => `Round ${round}: ${score} points, ${medalFor(score)}`;

let score = 300;
for (let round = 1; round <= 3; round++) {
  console.log(roundLine(round, score));
  score = score * 2;
}
```

```text
Round 1: 300 points, bronze
Round 2: 600 points, silver
Round 3: 1200 points, gold
```

When you started this module, a page of code like that might have looked like a foreign language. Now you can read every line of it.

## Show what you can do: Rock, Paper, Scissors

Module 1's project is a game a friend can play against the computer in a web browser: **Rock, Paper, Scissors**. Rock crushes scissors, scissors cut paper, and paper covers rock.

![The Rock, Paper, Scissors page: three big buttons for rock, paper and scissors, the computer's pick beside the player's, the round's result, and the score for each side, with the first to five wins](https://fsdtrainingmedia.blob.core.windows.net/public/images/2026/10/89fb4c93ee4749de9beabb92674c910f.webp)

The project hands you the finished page: its HTML, its CSS, and the code that connects the buttons to your functions. You don't need to know how a web page is built to do it. You write `game.js`, the rules of the game:

- **the computer's pick**, chosen at random;
- **who wins a round**, from the player's pick and the computer's pick;
- **the score**, kept for both sides;
- **the end of the game**, when one side reaches five wins.

Every one of those is a small function with one job, like the ones you wrote for Coin Dash, and tests check each of them. When it works, you'll have a game in your browser that you can play, and hand to a friend to beat. For a stretch, add two more moves, *lizard* and *Spock*, from the five-move version made famous by a TV comedy: Spock smashes scissors, and lizard eats paper.

## The one new piece: a random pick

The game needs one thing you haven't used yet: a random number. `Math.random()` gives back a random number from 0 up to, but not including, 1, such as `0.6157`. Multiply it by 3 and round it down with `Math.floor`, and you get 0, 1 or 2:

```javascript
const pick = Math.floor(Math.random() * 3);

console.log(pick);
```

Run it a few times, and it prints `0`, `1` or `2`, a different one from run to run. An `if` or a `switch` can turn 0, 1 and 2 into rock, paper and scissors: that's the computer's pick.

## So far, one value at a time

Every variable you've made holds one value: one score, one price, one name. That works until the data gets big. Here's the start of a road-trip playlist:

```javascript
const song1 = 'Highway Sunrise';
const song2 = 'Gas Station Coffee';
const song3 = 'Desert Radio';

console.log(`Now playing: ${song1}`);
```

```text
Now playing: Highway Sunrise
```

Three songs, three variables. A real playlist has 200 songs. How would you shuffle it, add up how long it plays, or find every song by one artist? With one variable per song, you can't, not in any reasonable way.

## What Module 2 unlocks

Module 2 gives your programs two new kinds of value, both of which hold many values at once:

- An **array** is a numbered list, like a playlist: `['Highway Sunrise', 'Gas Station Coffee', 'Desert Radio']`. It's written in `[ ]`, read "square brackets".
- An **object** is a record with labeled boxes, like a pet's profile on an adoption site: `{ name: 'Biscuit', species: 'dog', age: 3 }`. It's written in `{ }`, the curly braces you already know, with a label and a value in each box. Writing one out like this is called an **object literal**.

```javascript
const playlist = ['Highway Sunrise', 'Gas Station Coffee', 'Desert Radio'];
const pet = { name: 'Biscuit', species: 'dog', age: 3 };

console.log(`${playlist.length} songs, starting with ${playlist[0]}`);
console.log(`${pet.name} is a ${pet.age}-year-old ${pet.species}`);
```

```text
3 songs, starting with Highway Sunrise
Biscuit is a 3-year-old dog
```

`playlist.length` counts the songs, and `playlist[0]` is the first one: an array numbers its items from 0. `pet.name` reads the box labeled `name`.

Put the two together and you can hold almost any data a real app has: a high-score table is a list of records, each with a player's name and a score. In Module 2 you'll build a road-trip playlist, pet adoption profiles and a high-score leaderboard, and finish with **My Music Wrapped**: a "year in music" summary of a listening history, with your top songs, top artists and minutes listened, like the ones streaming apps share every December.

## A sneak peek: filter and map

Here's why the arrow functions from this chapter matter so much. Module 2 teaches **filter**, which keeps only the items of a list that pass a test, and **map**, which changes every item of a list. Each takes an arrow function:

```javascript
const scores = [1250, 300, 980, 2210];
console.log(scores.filter((score) => score >= 1000));
console.log(scores.map((score) => score * 2));
```

```text
[ 1250, 2210 ]
[ 2500, 600, 1960, 4420 ]
```

One line picks out every score of 1000 or more, and one line doubles every score in the list, whether it holds four scores or four million. You don't need to understand every part of it yet: that's what Module 2 is for.

## Check yourself

2 questions to try on the lesson page.

## So what

Module 1 gave you the building blocks of every program. Module 2 points them at real data, the lists and records behind every playlist, profile and leaderboard you've ever used.

## Key terms

- [Array](https://www.ask-codey.com/glossary/array-javascript-2)
- [Object Literal](https://www.ask-codey.com/glossary/object-literal)
- [map()](https://www.ask-codey.com/glossary/map-javascript)
- [filter()](https://www.ask-codey.com/glossary/filter-javascript)

## Related

- [Function Expressions and Arrow Functions](https://www.ask-codey.com/lessons/javascript-functions-arrow-functions)

Source: https://www.ask-codey.com/lessons/javascript-up-next-working-with-data