PywE|JavaScript

Variables are called variables because the values they store can change.

Use the = sign to change the value in status from "Watching Netflix" to "Relaxing at the beach".

var status = "Watching Netflix";
status = "Relaxing at the beach";
console.log(status);

We can update variables as often as we want.

Try it yourself: change the value of status to "Reading".

var status = "Watching Netflix";
status = "Relaxing at the Beach";
console.log(status);

status = "Reading";
console.log(status);

We can also give variables the values of other variables.

Let's give the status variable the value of defaultStatus.

var defaultStatus = "Hi there!";
var status = "Playing football";

status = defaultStatus;
console.log(status);

When we update a variable, it forgets its previous value.

Let's display the status variable when it's set to "Playing football" and when it's set to "Walking the dog".

var status = "Playing football";
console.log(status);

status = "Walking the dog";
console.log(status);

Variable names can contain numbers, too. Adding numbers is useful with multiple similar variables. Let's create the variable car1 here.

var car1

After creating and naming a variable, we use the = sign to store a value inside it. Like var city = "Accra".

var city = "Accra"

To finish creating a variable, we put a semicolon, ;, at the end of the line.

var city = "Accra";

The values we've been storing like "Accra" are strings. Strings are words in double quotes.

Strings can contain all sorts of letters and symbols, including spaces. For example, "Harmattan is coming.".

We can add string values together with a + sign.

Let's add the values "Followers:" and "55" together.

"Followers:" + "55";

We call adding together string values an expression because it creates a single string value.

Let's add the expression between the parentheses of console.log().

console.log("Followers:" + "55");

When expressions contain variables, they use the values in the variables.

Let's create an expression that adds the value "Followers:" and the variable followers together.

var followers = "55";
"Followers:" + followers;

We can use console.log() to see the results of expressions.

We just add a console.log() instruction around the expression.

var numberOfFollowers = "55";
console.log("Followers:" + numberOfFollowers);

Since expressions become values, we can give them to variables just like values.

Let's store the expression "Posts:" + "13" in the variable label and display it in the console.

var label = "Posts:" + "13";
console.log(label);

Lines of code are instructions for the computer to follow.

When we run code, we tell the computer to follow the instructions we put together.

The order of the instructions matters because the computer follows the instructions line by line.

Let's create the variable step1 first, step2 second, and step3 third.

var step1 = "Collect pants";
var step2 = "?";
var step3 = "Profit";

With the special instruction console.log(), we tell the computer to display a value in an area called the console. Here on Pywe, it's the box below the code. It might be different with your IDE

console.log("Hello, World!");

We can use the console.log() instruction as often as we want. The computer displays every value on a line in the console.

console.log("3, 2, 1");
console.log("GO!");

We can use console.log() to display variables like greeting, too.

var greeting = "Hello, World!";
console.log(greeting);

When we display variables in the console, their values appear instead of their names. If we log name here, it'll show its value.

var name = "Ellie";
console.log(name);

Let's put your knowledge on Creating Variables into practice and help a travel journaling app keep track of a traveler's location across Ghana.

We'll create the variables for the country, region, and city the traveler is in and give them string values.
Open your text editor let's get going🤗️.

Let's start with the variable that keeps track of the country.

Start creating the variable by typing var.

var

Give the variable a descriptive name.

var country

Give the country variable the string value "Ghana".

var country = "Ghana"

To finish creating the country variable, put a semicolon at the end of the line.

var country = "Ghana";

Now let's create a variable to track the region the traveler is located in.

Create a region variable and give it the string value "Ashanti".

var country = "Ghana";
var region = "Ashanti";

Next up: the city.

Type the keyword to create a variable.

var country = "Ghana";
var region = "Ashanti";
var

Give the variable a valid name.

var country = "Ghana";
var region = "Ashanti";
var city

Give the city variable the string value "Kumasi".

var country = "Ghana";
var region = "Ashanti";
var city = "Kumasi";

Great work! Here's an app that tracks a traveler's location.

The country variable has the value "Ghana", region has the value "Ashanti", and city has the value "Kumasi".

var country = "Ghana";
var region = "Ashanti";
var city = "Kumasi";

That was fun! 😎️

Remember Mario, yeah you do! Let's put your knowledge on Creating Variables into practice and write an app on Mario, the famous video game character.

We'll create variables for Mario's name and job and use them to tell the world about him. Or at least the console.

Let's start with the variable for Mario's name.

Type the three-letter keyword to create a variable.

var

Call the variable name.

var name

Give the name variable the string value "Mario" and put a semicolon at the end of the line.

var name = "Mario";

Create a job variable and give it a string value.

var name = "Mario";
var job = "Plumber"

Time to display Mario's name.

Put together the special instruction to display a value in the console.

var name = "Mario";
var job = "Plumber";
  
console.log

Place the name variable between the parentheses of console.log() and put a semicolon at the end of the line.

var name = "Mario";
var job = "Plumber";
  
console.log(name);

Use console.log() to display the value of the job variable.

var name = "Mario";
var job = "Plumber";
  
console.log(name);
console.log(job);

Fantastic! Here's an app to help us remember the name and job of our favorite video game character. Who was it again?

var name = "Mario";
var job = "Plumber";
  
console.log(name);
console.log(job);

Yeah that's right

Now try changing the values of the variables name and job to other string values you like.

There are other kinds of values, too. Like numbers, which have no double quotes around them.

var numberOfLikes = 5;

Numbers make it easier to keep track of numeric values. Like the number of likes on a Facebook post.

Let's create a numberOfLikes variable and set it to 5.

var numberOfLikes = 5;
console.log(numberOfLikes);

We can create expressions with numbers, too. We add numbers together with the + sign and subtract them from each other with the - sign.

Let's display 6 in the console by setting numberOfLikes to 5 + 1.

var numberOfLikes = 5 + 1;
console.log(numberOfLikes);

We use the * sign to multiply numbers and the / sign to divide numbers.

Let's turn 0.5 into its percent value by multiplying it by 100.

var percent = 0.5 * 100;
console.log(percent);

When we give numbers to variables, we can use the variables for calculations, too.

Let's add 1 to the numberOfSteps variable before displaying it in the console.

var numberOfSteps = 70;
console.log("You're on step:");
console.log(numberOfSteps + 1);

Since expressions become values, we can store calculation results in variables.

Here we store the calculation result in the total variable.

var private = 3;
var public = 10;
var total = private + public;
console.log("Total posts: " + total);

Have you ever tried to convert miles into kilometres or the other way around? Spoiler alert: it's tough.

We'll make it easier by building a converter app to solve this problem for good.

Let's start by creating a variable for the miles.

var miles;

Let's give miles an initial value of 500.

var miles = 500;

Now let's create a kilometres variable and give it the value of miles.

var miles = 500;
var kilometres = miles;

A mile is about 1.609344 kilometres. Let's transform miles into kilometres by multiplying the number of miles by that number.

So we update kilometres by multiplying miles by 1.609344.

var miles = 500;
var kilometres = miles * 1.609344;

Now it's time to display the converted distance in the console.

We'll use console.log() to display the value of kilometres.

var miles = 500;
var kilometres = miles * 1.609344;
console.log(kilometres)

That's it: an app that converts miles into kilometres. Gone are the days of confusion!

var miles = 500;
var kilometres = miles * 1.609344;
console.log(kilometres);

Now try changing the value of miles and check what happens in the console.

var miles = 40;
var kilometres = miles * 1.609344;
console.log(kilometres);

There's a special value that's neither a string nor a number: true.

There are no quotes around it, and it's not a numeric value.

true is great for situations like checking if a switch is on or if a feature is enabled.

Let's display true in the console.

console.log("Allow updates");
console.log(true);

We can store true in a variable just like a string or a number.

Let's store true in a variable and display it in the console.

var correct = true;
console.log(correct);

false is another special value and the opposite of true. We can use it like true.

Let's save the value false in the variable status and display status in the console.

console.log("Device charged");
var status = false;
console.log(status);

A ! sign in front of true makes the expression result in false. If something is not true, it has to be false.

The ! sign is the negation operator. It turns values into their opposite.

When we change a value to its opposite with !, we negate it.

Let's put a ! sign before true to change its value.

console.log(!true);

The ! operator before false changes its value, too. If a value is not false, it has to be true.

console.log(!false);

We can use the ! operator with variables to negate the values they store.

var isMorning = true;
console.log(!isMorning);

We can save a whole negation in another variable, too.

Let's create the variable isEvening and use ! to change isMorning to false.

var isMorning = true;
var isEvening = !isMorning;
console.log(isEvening);

Let's write some code that switches an office air conditioner off over the weekend.

Here's a peek at the completed code. We'll use two variables to tell if the day is a weekday and if the AC should be on or off.

var isWeekday = false;
var acOn = !true;

console.log("Weekday");
console.log(isWeekday);

console.log("Air conditioning");
console.log(acOn);

Let's start creating the first variable by coding var.

var

This code will run on a weekday. Let's create the right variable and give it the value true.

var isWeekday = true;

When it's a weekday, the air conditioning switch, acOn, should be set to true.

var isWeekday = true;
var acOn = true;

Let's display Weekday and the value in the isWeekday variable in the console.

var isWeekday = true;
var acOn = true;

console.log("Weekday");
console.log(isWeekday);

Now let's display Air conditioning and the value in the acOn variable in the console.

var isWeekday = true;
var acOn = true;

console.log("Weekday");
console.log(isWeekday);

console.log("Air conditioning");
console.log(acOn);

It's no longer a weekday, so let's change the value of isWeekday to false.

var isWeekday = false;
var acOn = true;

console.log("Weekday");
console.log(isWeekday);

console.log("Air conditioning");
console.log(acOn);

As it's not a weekday, the air conditioner should be switched off. Let's negate the value of true.

var isWeekday = false;
var acOn = !true;

console.log("Weekday");
console.log(isWeekday);

console.log("Air conditioning");
console.log(acOn);

There we have it! We've created some simple code that controls the operation of an air conditioner.

var isWeekday = false;
var acOn = !true;

console.log("Weekday");
console.log(isWeekday);

console.log("Air conditioning");
console.log(acOn);

Let's create a smart light switch that switches the lights off if it's daytime and on if it's nighttime.

Here's a peek at the completed code. We'll use isDay to store day and night, and another variable to switch the lights on.

var isDay = false; 
var lightsOn = !isDay;

console.log("Daytime?");
console.log(isDay);

console.log("Lights on?");
console.log(lightsOn);

Let's start by creating an isDay variable.

var isDay;

Let's say it's daytime. It's always daytime in some part of the world.

Let's set isDay to true.

var isDay = true;

Since it's daytime and we want to save energy, the lights should be off.

Let's create a lightsOn variable and store false in it.

var isDay = true;
var lightsOn = false;

Now let's use console.log() to display Daytime? in the console.

var isDay = true;
var lightsOn = false;
  
console.log("Daytime?");

Is it daytime? Is it nighttime?

Let's display the value of the isDay variable in the console.

var isDay = true; 
var lightsOn = false;

console.log("Daytime?");
console.log(isDay);

Let's display Lights on? in the console.

var isDay = true; 
var lightsOn = false;

console.log("Daytime?");
console.log(isDay);

console.log("Lights on?");

Let's display the value of lightsOn in the console.

var isDay = true; 
var lightsOn = false;

console.log("Daytime?");
console.log(isDay);

console.log("Lights on?");
console.log(lightsOn);

We also need to update lightsOn, of course. Let's put the negation operator to good use.

Let's set lightsOn to the opposite of isDay.

var isDay = false; 
var lightsOn = !isDay;

console.log("Daytime?");
console.log(isDay);

console.log("Lights on?");
console.log(lightsOn);

There we go! We've built an app that checks if it's daytime or nighttime and switches the lights on and off accordingly.

var isDay = false; 
var lightsOn = !isDay;

console.log("Daytime?");
console.log(isDay);

console.log("Lights on?");
console.log(lightsOn);

We learned how to create and store values, but how do we compare them?

We need to compare numbers in situations like checking a user's entered PIN matches their saved PIN.

var enteredPin = 5448;
var expectedPin = 5440;

To compare if two numbers are the same, we use the equality operator, ===.

5 === 5

When comparing, there are only two results: true or false.

When we compare the same numbers with the equality operator, the result is true.

console.log(10 === 10);

When we compare the different numbers with the equality operator, the result is false.

console.log(9 === 10);

To check if a number isn't equal to another number, we use the inequality operator, !==.

console.log(1 !== 10);

We can store the result of a comparison with the inequality operator in a variable.

Let's save the comparison between 1 and 2 into the variable result.

var result = 1 !== 2;
console.log(result);

Variables can store the result of equality comparisons, too.

var result = 1 === 2;
console.log(result);

We can compare values with variables and variables with other variables.

Let's use === to compare the contents of the variables.

var one = 1;
var two = 2;
console.log(one === two);
console.log(one !== two);