Back to Real Variables
Code Studio · Level 2

Variable Builder

Students edit variable values and see how output changes without rewriting every command.

20-25 min Ages 9-12 Builder JavaScript

More variable power

You already know a variable is a labeled box. This page adds two new tricks: boxes that hold numbers, and gluing boxes together to build sentences.

  1. 1

    Boxes can hold numbers too

    let score = 10; has no quotes — that makes it a number, not a string. Numbers can do math: if you write score + 5, JavaScript answers 15. With quotes, "10" would just be text, like words on a sticker.

  2. 2

    Glue pieces together with +

    Between strings, + works like glue. JavaScript opens each box, takes out the value, and sticks all the pieces into one sentence:

    playerName+" earned "+score+" points." → "Ari earned 10 points."
  3. 3

    Change one box, update everything

    playerName is used in both messages, but it's stored only once. Change "Ari" to your name, run the code, and watch every line update by itself. That's why coders love variables: fix a value in one place instead of hunting through the whole program.

Code Editor

Change the variables.

Example code 
let playerName = "Ari";
let score = 10;
let badge = "Star Coder";

say(playerName + " earned " + score + " points.");
say(playerName + " unlocked: " + badge);
Output

Program result

Robot ready to speak your strings

Type real JavaScript, then run it.