Javascript · Functions (Basics)
Function Declarations (DRY principle)
The full text of this chapter, to read or revisit. To practise, do the exercises.
▶ Do the exercisesExercise 1 — Don't Repeat Yourself
Before each battle, your team does the same three-line warm-up. Three battles, three copies of the same code:
console.log("Team, get ready!");
console.log("Stretch... breathe...");
console.log("Go!");
console.log("Team, get ready!");
console.log("Stretch... breathe...");
console.log("Go!");
If you want to change one word, you have to change it everywhere. A function lets you write the block once, give it a name, and reuse it:
function warmUp() {
console.log("Team, get ready!");
console.log("Stretch... breathe...");
console.log("Go!");
}
warmUp();
warmUp();
Same output, but the code exists in one place only. Programmers call this the DRY principle: Don't Repeat Yourself.
Exercise 2 — Anatomy of a Function
function name() {
// code to run
}
1. The keyword `function`
2. The name you choose, followed by parentheses `()`
3. The body: a block between `{` and `}` holding the code
Writing this is called declaring the function. To run it, write its name followed by parentheses: that's a call.
function healTeam() {
console.log("All Codémon are healed!");
}
healTeam();
Exercise 3 — Spot the Declaration
Which line correctly declares a function named `attack`?
Options
• ```function attack() {```
• ```function attack {```
• ```attack function() {```
• ```function() attack {```
Hint : Keyword, then name, then parentheses, then the block.
Exercise 4 — Declare the Menu
Declare a function `showMenu` that prints the two options, then call it.
____ showMenu____ {
console.log("1. Fight");
console.log("2. Run");
}
showMenu();
Options: function () [] {} def
Hint : A declaration always starts with the same keyword, and the name is never alone.
Exercise 5 — Declaring Isn't Running
Declaring a function only explain to JavaScript what it does. Nothing runs yet. This code prints nothing at all:
function battleCry() {
console.log("Pyrochu roars!");
}
The body only runs when you call the function. Add the call, and the message appears:
function battleCry() {
console.log("Pyrochu roars!");
}
battleCry();
Exercise 6 — Quiz: Silent Function
What does this code print?
function cheer() {
console.log("Go Aquachu!");
}
cheer;
Options
• Nothing
• ```Go Aquachu!```
• An error
• ```undefined```
Hint : Look closely at the last line: is it really a call?
Exercise 7 — Naming Functions
Function names follow the same rules as variable names: camelCase, no spaces, no starting digit. One extra habit: since a function does something, start its name with a verb.
function showStats() {
console.log("HP: 40 | Attack: 12");
}
function healAll() {
console.log("Everyone is back to full HP");
}
showStats();
healAll();
Good names
`showStats`, `healAll`, `startBattle` say what happens. `stats`, `thing`, `doIt` don't. A good name saves a comment.
Exercise 8 — Parts of a Function
Match each part with its role.
Items to match
• function
• healTeam
• { ... }
• healTeam();
Definitions
• Keyword that starts a declaration
• The name of the function
• The body: code that will run
• A call: runs the body
Exercise 9 — Apply DRY
Zap's attack was copy-pasted. Name the function `zapAttack` and call it twice instead.
function ____() {
console.log("Zap charges...");
console.log("Zap strikes!");
}
____();
zapAttack();
Options: zapAttack zapAttack attack function
Hint : The name used in the call must be exactly the one used in the declaration.
Exercise 10 — Quiz: Why Functions?
What is the main reason to put code inside a function?
Options
• To write it once and reuse it as many times as needed
• To make the code run faster
• To create new variables
• To stop the program
Hint : Think about the three copies of the warm-up.
Exercise 11 — Title Banner
Every screen of your game starts and ends with the same banner.
1. Declare a function `showBanner` that prints `"=========="`, then `"CODÉMON"`, then `"=========="`
2. Call it, print `"Welcome, trainer!"`, then call it again
Starter code
// Write your code here