Back

Activity 1.5 Updating Variables

divider

Introduction

Activity 1.5

Updating Variables

Topics

  • Working with Dynamic Data
  • Keeping Track of Changes with Variables

Working with Dynamic Data

Variables don't have to stay the same throughout a program. We can change the value of a variable after it's been initialized.

let age = 15;

Working with Dynamic Data

Variables don't have to stay the same throughout a program. We can change the value of a variable after it's been initialized.

let age = 15;

console.log("🎉🎂🥳 Happy birthday!");

Working with Dynamic Data

Variables don't have to stay the same throughout a program. We can change the value of a variable after it's been initialized.

let age = 15;

console.log("🎉🎂🥳 Happy birthday!");

age = 16;

Keeping Track of Changes with Variables

A program often needs to track and update a value as it runs. This is done by modifying the variable's value using mathematical operations like addition, subtraction, multiplication, and division. 

let health = 100;
console.log("Health: " + health);
console.log("Enemy attacks.");
health = health - 5;
console.log("Health: " + health);

Keeping Track of Changes with Variables

A program often needs to track and update a value as it runs. This is done by modifying the variable's value using mathematical operations like addition, subtraction, multiplication, and division. 

let health = 100;
console.log("Health: " + health);
console.log("Enemy attacks.");
health = health - 5;
console.log("Health: " + health);
Health: 100
Enemy attacks.
Health: 95

Keeping Track of Changes with Variables

let health = 100;
console.log("Health: " + health);
console.log("Enemy attacks.");
health = health - 5;
console.log("Health: " + health);
Health: 100
Enemy attacks.
Health: 95
Variable Update

'F' → Fullscreen

Objectives

  • icon Updating variable values using the assignment operator.
divider

Activity Tasks

  • icon Create a new project named 1-5-updating-variables.js.
  • icon Complete each task individually.

Task 1: Battle Demo

1-5-updating-variables.js
console.log("--- Demo 1 - Battle Demo ---");
let playerHealth = 100;
let playerAttack = 25;
let enemyHealth = 100;
let enemyAttack = 20;
let potions = 3;


console.log(`Health: ${playerHealth}`);
console.log(`Enemy health: ${enemyHealth}`);
console.log();


console.log("Player attacks.");
enemyHealth = enemyHealth - playerAttack;
console.log(`You did ${playerAttack} damage! Enemy health: ${enemyHealth}`);
console.log();


console.log("Enemy attacks.");
playerHealth = playerHealth - enemyAttack;
console.log(`Enemy did ${enemyAttack} damage! Player health: ${playerHealth}`);
console.log();


console.log("Using potion...");
playerHealth = playerHealth + 10;
potions = potions - 1;
console.log(`Player health: ${playerHealth}. Potions left: ${potions}`);
console.log("\n\n"); // What on earth is \n? Consider Googling '\n Javascript'
//

Task 2: Banking Simulator

1-5-updating-variables.js
console.log("--- Demo 1 - Battle Demo ---");
let playerHealth = 100;
let playerAttack = 25;
let enemyHealth = 100;
let enemyAttack = 20;
let potions = 3;


console.log(`Health: ${playerHealth}`);
console.log(`Enemy health: ${enemyHealth}`);
console.log();


console.log("Player attacks.");
enemyHealth = enemyHealth - playerAttack;
console.log(`You did ${playerAttack} damage! Enemy health: ${enemyHealth}`);
console.log();


console.log("Enemy attacks.");
playerHealth = playerHealth - enemyAttack;
console.log(`Enemy did ${enemyAttack} damage! Player health: ${playerHealth}`);
console.log();


console.log("Using potion...");
playerHealth = playerHealth + 10;
potions = potions - 1;
console.log(`Player health: ${playerHealth}. Potions left: ${potions}`);
console.log("\n\n");


// -----------------------------------------------------------------------------


console.log("--- Demo 2 - Banking Simulator ---");
let accountName = "Checking Account";
let balance = 100.50;


console.log(`${accountName} balance: ${balance}`);
console.log(`Depositing $99.01 to ${accountName}`);
balance = balance + 99.01;
console.log(`${accountName} balance: ${balance}`);
console.log("\n\n");
//

Task 3: High Score Tracker

1-5-updating-variables.js
console.log("--- Demo 1 - Battle Demo ---");
let playerHealth = 100;
let playerAttack = 25;
let enemyHealth = 100;
let enemyAttack = 20;
let potions = 3;


console.log(`Health: ${playerHealth}`);
console.log(`Enemy health: ${enemyHealth}`);
console.log();


console.log("Player attacks.");
enemyHealth = enemyHealth - playerAttack;
console.log(`You did ${playerAttack} damage! Enemy health: ${enemyHealth}`);
console.log();


console.log("Enemy attacks.");
playerHealth = playerHealth - enemyAttack;
console.log(`Enemy did ${enemyAttack} damage! Player health: ${playerHealth}`);
console.log();


console.log("Using potion...");
playerHealth = playerHealth + 10;
potions = potions - 1;
console.log(`Player health: ${playerHealth}. Potions left: ${potions}`);
console.log("\n\n");


// -----------------------------------------------------------------------------


console.log("--- Demo 2 - Banking Simulator ---");
let accountName = "Checking Account";
let balance = 100.50;


console.log(`${accountName} balance: ${balance}`);
console.log(`Depositing $99.01 to ${accountName}`);
balance = balance + 99.01;
console.log(`${accountName} balance: ${balance}`);
console.log("\n\n");


// -----------------------------------------------------------------------------


console.log("--- Demo 3 - High Score Tracker ---");
let playerScore = 0;
console.log(`Current score: ${playerScore}`);
console.log("Scored 100 points!");
playerScore = playerScore + 100;
console.log(`New score: ${playerScore}`);
console.log("Scored 500 more points for a headshot!");
playerScore = playerScore + 500;
console.log(`New score: ${playerScore}`);
console.log("\n\n");
//

Task 4: Social Media Analytics

1-5-updating-variables.js
console.log("--- Demo 1 - Battle Demo ---");
let playerHealth = 100;
let playerAttack = 25;
let enemyHealth = 100;
let enemyAttack = 20;
let potions = 3;


console.log(`Health: ${playerHealth}`);
console.log(`Enemy health: ${enemyHealth}`);
console.log();


console.log("Player attacks.");
enemyHealth = enemyHealth - playerAttack;
console.log(`You did ${playerAttack} damage! Enemy health: ${enemyHealth}`);
console.log();


console.log("Enemy attacks.");
playerHealth = playerHealth - enemyAttack;
console.log(`Enemy did ${enemyAttack} damage! Player health: ${playerHealth}`);
console.log();


console.log("Using potion...");
playerHealth = playerHealth + 10;
potions = potions - 1;
console.log(`Player health: ${playerHealth}. Potions left: ${potions}`);
console.log("\n\n");


// -----------------------------------------------------------------------------


console.log("--- Demo 2 - Banking Simulator ---");
let accountName = "Checking Account";
let balance = 100.50;


console.log(`${accountName} balance: ${balance}`);
console.log(`Depositing $99.01 to ${accountName}`);
balance = balance + 99.01;
console.log(`${accountName} balance: ${balance}`);
console.log("\n\n");


// -----------------------------------------------------------------------------


console.log("--- Demo 3 - High Score Tracker ---");
let playerScore = 0;
console.log(`Current score: ${playerScore}`);
console.log("Scored 100 points!");
playerScore = playerScore + 100;
console.log(`New score: ${playerScore}`);
console.log("Scored 500 more points for a headshot!");
playerScore = playerScore + 500;
console.log(`New score: ${playerScore}`);
console.log("\n\n");


// -----------------------------------------------------------------------------


console.log("--- Demo 4 - Social Media Analytics ---");
let likes = 23;
console.log(`Post likes: ${likes}`);
console.log("A friend liked the post!");
likes = likes + 1;
console.log(`Post likes: ${likes}`);
console.log("Another 10 people liked the post!");
likes = likes + 10;
console.log(`Post likes: ${likes}`);
//
divider

Sample Output

Your program output should something similar to the sample output below.

Sample Output
--- Demo 1 - Battle Demo ---
Health: 100
Enemy health: 100


Player attacks.
You did 25 damage! Enemy health: 75


Enemy attacks.
Enemy did 20 damage! Player health: 80


Using potion...
Player health: 90. Potions left: 2






--- Demo 2 - Banking Simulator ---
Checking Account balance: 100.5
Depositing $99.01 to Checking Account
Checking Account balance: 199.51






--- Demo 3 - High Score Tracker ---
Current score: 0
Scored 100 points!
New score: 100
Scored 500 more points for a headshot!
New score: 600






--- Demo 4 - Social Media Analytics ---
Post likes: 23
A friend liked the post!
Post likes: 24
Another 10 people liked the post!
Post likes: 34
divider

Reflection Questions

You may write your reflection answers as comments at the bottom of your code.

  1. When you use let to create a variable for the first time, you're setting its starting value. After that, you can change the variable's value without using let again. Why do you think programming languages have these two different steps? What would happen if we couldn't change a variable's value after we first created it?
  2. Think about the four demos you completed. Describe another real-world scenario where updating a variable would be essential. What would the variable represent, and what operations (addition, subtraction, etc.) would be applied to it?
divider

Submission

Submit your activity and reflection answers to the appropriate dropbox.

Activity Complete