← ACARA Digital Technologies Years 7–8

From visual blocks to typed JavaScript

A text-based language where each block you snapped together becomes one line of code that you type exactly, and the computer follows it literally.

Part of: ACARA Digital Technologies Years 7–8 — Programming with Control Structures and Functions (JavaScript) — Module 1

Understanding From visual blocks to typed JavaScript in ACARA Digital Technologies Years 7–8

What it does: Stacked blocks run in order and typed lines do too, so 'Start' prints before 'End'. Sequence is the same idea in both. The if block's condition and its inside blocks become the if keyword, a condition in brackets and a pair of braces holding the lines. Each block turns into one line of code. Instead of snapping a block in place, you type the line. JavaScript follows your text literally, so capital letters matter. console.log must be written in exactly this way. Computers follow code literally. They do not guess, so a spelling mistake causes an error. JavaScript is used by professionals to build websites, apps and games. Block coding is a good step towards it.

Common mistakes: prompt is spelled wrong. Typed code must be exact, so the computer cannot find promt. It should be prompt("Name?"). The variable name is misspelled. The computer follows the text literally and has no variable called scor. It should be console.log(score);.

Class: _____________________ · Name: _____________________ · Date: _________

Free printable worksheet with full answer key — or add this module to a class and your students practise it interactively.

🖨 Print worksheet + answer key Add From visual blocks to typed JavaScript to a class →

This module's key terms are also in a printable crossword (Modules 522–560) and word search (Modules 522–580).

Take this worksheet further — free with Cloodit

Each concept is reinforced from every angle — learned, then applied, then tested.

Learning

Duo

In typed JavaScript, a block like "say Hello" becomes what?

One line of text you type: console.log("Hello");A coloured shape you drag onto the screen

Matches

Console.log("Hello");

↓

Wrong capital letter: JavaScript is case sensitive, so Console is not the same as console. It must be console.log.

Applying

Meanings

Term

JavaScript

Meaning

A text-based language where each block you snapped together becomes one line of code that you type exactly, and the computer follows it literally.

Practice

let score = 7;

Testing

Gaps

("Hello, world!");

Check Answer

Spots

1let name = promt("Name?");

2console.log("Hi " + name);

Cloodit turns curriculum-aligned coding content into journeys students work through one biome at a time.

Students earn collectable badges

Over 100 of them, across seven natural biomes.

Study Buddy

Students build a real study resource

Turns their work into revision material ready for Flash Cards and Exam study.

Diamond Dash — one of Cloodit's live, competitive Sprint games

Students lock in with Sprints

Live, competitive practice for the start of the lesson or a teacher-led lesson finisher.

A Cloodit certificate of achievement, ready to personalise and print

Custom printable certificates

Honour your top performers, or encourage a student who's trying hard — ready to print in seconds.

Add to class →

Quick Questions

1. In typed JavaScript, a block like "say Hello" becomes what?

A. A coloured shape you drag onto the screen

B. One line of text you type: console.log("Hello"); ✓

Each block turns into one line of code. Instead of snapping a block in place, you type the line.

2. Which spelling will a computer accept?

A. console.log("Hi"); ✓

B. Console.Log("Hi");

JavaScript follows your text literally, so capital letters matter. console.log must be written in exactly this way.

3. You type consle.log("Hi"); by mistake. What happens?

A. The computer guesses what you meant and prints Hi

B. The computer does not understand it and shows an error ✓

Computers follow code literally. They do not guess, so a spelling mistake causes an error.

4. Which statement is true about JavaScript?

A. It is a text-based language that professional programmers use ✓

B. It is only a toy language made for practising with blocks

JavaScript is used by professionals to build websites, apps and games. Block coding is a good step towards it.

5. A block program uses sequence, decisions and repeats. What changes when you move to JavaScript?

A. The same ideas are used, but you type them as text ✓

B. The ideas are different, so you must learn new ones

Sequence, selection (if) and iteration (loops) work the same way. Only the way you write them changes.

Match the Pairs

console.log("Hi"); → One typed line that does the same job as a 'say Hi' block, and it must be spelled exactly

let score = 0; → One typed line that does the job of a 'set score to 0' variable block

Sequence still applies in typed code: lines run from top to bottom, just like stacked blocks → console.log("Start"); console.log("End");

A decision from an if block becomes typed text using the word if, a condition and curly braces → if (score > 10) { console.log("Win"); }

Console.log("Hello"); → Wrong capital letter: JavaScript is case sensitive, so Console is not the same as console. It must be console.log.

console.log("Hello); → The closing quote is missing, so the text is not closed. It needs a matching quote before the bracket.

Key Term

JavaScript

A text-based language where each block you snapped together becomes one line of code that you type exactly, and the computer follows it literally.

Fill in the Blanks

1. console.log("Hello, world!");

Hint: Type the command that replaces a say block by printing a message to the console.

2. let name = prompt("What is your name?");

Hint: Type the function that replaces an ask block by showing a box for the user to type in.

3. if (score > 5) { console.log("You win!"); }

Hint: Type the keyword that replaces an if block, so the program makes a decision.

4. for (let i = 0; i < 3; i++) { console.log("Hi"); }

Hint: Type the keyword that replaces a repeat block, so the loop runs a set number of times.

5. let lives = 3; lives = lives - 1; console.log(lives);

Hint: Type the keyword that creates a variable, like a create variable block. Lines run in order from top to bottom.

Spot the Error

Question 1

A let name = promt("Name?");

B console.log("Hi " + name);

C console.log("Welcome!");

Line A — prompt is spelled wrong. Typed code must be exact, so the computer cannot find promt. It should be prompt("Name?").

Question 2

A let score = 8;

B score = score + 2;

C console.log(scor);

Line C — The variable name is misspelled. The computer follows the text literally and has no variable called scor. It should be console.log(score);

Question 3

A let age = 13;

B if (age >= 13) {

C Console.log("Teen");

D }

Line C — JavaScript cares about capital letters. Console with a capital C does not exist. It should be console.log("Teen");

Question 4

A let total = 0;

B for (let i = 1, i <= 3, i++) {

C total += i;

D }

Line B — The three parts of a for loop are separated by semicolons, not commas. It should be for (let i = 1; i <= 3; i++) {

Question 5

A let n = 3;

B while n > 0 {

C console.log(n);

D n--;

E }

Line B — The repeat condition of a while loop must be inside round brackets. It should be while (n > 0) {

Student with a class code? Join your class →