JavaScript Exercise 03, 04: Values and Variables

In this exercise, we will go through JavaScript concepts, including values and variables. These are essential to JavaScript programmers.

Exercise 3.1. Values

We have seen some numbers in JavaScript, like 135. As well as some strings, like “Hello”. These are called values in JavaScript.

A number(135) is a value, a string(“Hello”) is a value. We use number values to do maths and string values to send a message. We use values all the time. In complex programs, there will be hundreds or thousands of values, therefore we need something to store our values, that would be variables.

Exercise 3.2. Variables

Variables are used to store values. Think of it as a box. You can put a number(135) into the box and you can also put a string(“Hello”) into a box. The word “variable” means “changeable”, that says, you can change what’s inside a variable. You can put a number of 135 into a variable, and later you can change it to 246 or even to a string of “Hey”.

Let’s take a look at some examples of variables.

var myNumber = 5;
var myString = "Zack";

var stands for variable. It’s a keyword to declare a variable.

myNumber is the name of the variable. So is myString. We usually use letters and numbers without any spaces to name a variable.

The equal sign(=) is used to assign a value to a variable. It means put whatever on the right hand side to the variable on the left hand side. The equal sign is also called the assignment sign.

5 is the number value that we want to put into the variable myNumber. “Zack” is the string value we put into myString.

Let’s try to play with variables:

var firstNumber = 135;
var secondNumber = 246;
console.log(firstNumber + secondNumber);

You will get 381 as shown in the animation demo below:

JavaScript Values and Variables
JavaScript Values and Variables

That’s right. JavaScript uses whatever inside a variable to compute.

Now take a look at the following example:

var myNumber;
myNumber = 5;

It’s the same as var myNumber = 5;. We call the first line declaration (or definition), it declares or defines a variable; the second line assignment, it assigns a value to a variable. If we add another line:

myNumber = 10;

This is called reassignment. Try to print myNumber with console.log(). You will get the latest value, which is 10. JavaScript only stores the last value.

Exercise 3.3. Exercises for Values and Variables

Now you have some basic concepts of values and variables, let’s practice:

  1. Declare a variable named: firstString, assign “Hello ” (there’s a space at the end) to it.
    Declare another variable named secondString, assign “JavaScript” to it.
    Print the two variables with a “+” in between.
  2. Declare a variable name: apple, assign a number of 5 to it.
    Declare a variable name: Apple, assign a number of 10 to it.
    Declare a variable name: APPLE, assign a number of 15 to it.
    Print each variables with console.log(). See if there is any differences and what you can learn from it.

Exercise 3.4. Checkpoint

In this exercise, you have learned:

  1. What are values and variables.
  2. To define / declare a variable and assign a value to it.
  3. To manipulate a variable: to change the value of a variable, to compute with with variables, etc.
JavaScript Boolean Type
JavaScript Boolean Type

JavaScript Exercise 04: True or False? Boolean Type

In this exercise, we will learn a new value type: Boolean. We will also do some comparison as well as to write some code with boolean variables.

Exercise 4.1. Revise and warmup

Let’s do some exercises to revise what we learned from the last practice:

  1. Declare a variable named: numberA, assign it to be 10.
  2. Declare another variable named: numberB, assign it to be 11.
  3. Print the sum of the two variables.

Exercise 4.2. Boolean Values

Continue with the exercise above with the following two lines:

console.log(numberA > numberB);
console.log(numberA < numberB);
console.log(numberA === numberB);
console.log(numberA === 10);

You should have:

false
true
false
true

Previously, we have two value types: number and string. Here we got the third one: boolean. Boolean type has only two possibilities: true or false. Boolean is used to do comparisons and to help you make decisions (if true, do this; if false, do that; etc).

Exercise 4.3. Number comparison

Let’s try more comparisons. Continued with the previous program.

var numberC = 10;

console.log(numberA >= numberB);
console.log(numberA <= numberB);

console.log(numberA >= numberC);
console.log(numberA <= numberC);

console.log(numberA !== numberB);
console.log(numberA !== numberC);

Remember, numberA is 10, numberB is 11 and numberC is also 10. Here are the results:

false
true

true
true

true
false

Here are the meanings of the comparison operators:

  • > : Greater than
  • < : Less than
  • <= : Less than or equal to
  • >= : Greater than or equal to
  • === : Equal to
  • !== : NOT equal to

Exercise 4.4. String comparison

We all know that numbers are comparable, but can we compare strings? The answer is yes. We compare strings by alphabet order, the latter, the greater. And any lower case letter is smaller than a upper case letter. Now try the following code, make sure that you understand every line.

"a" < "b"
"a" < "z"
"a" < "A"

"A" < "B"
"A" < "Z"

"abc" < "abd"
"abc" < "abcd"

Exercise 4.5. Define a boolean varialbe

Since boolean is a value, we can use a variable to store it. It’s the same as numbers and strings. Take a look at the following code:

var myBoolean = true;

console.log(myBoolean);

myBoolean = false;

console.log(myBoolean);

We declare a boolean variable named myBoolean and assign true as its value. So when we console.log() it, we got true. Next, we reassign myBoolean to the boolean value of false. Therefore we got false in the console. Can’t be any simpler.

Exercise 4.6. Checkpoint

In this exercise, we’ve learned:

  1. The third value type: Boolean, which has only two values: true and false.
  2. To do number and string comparison.
  3. To define a boolean variable.
Tagged with: , , ,

No comment yet, add your voice below!


Leave a Reply