As well as needing to assign values to variables, we sometime need to compare variables or literals.
We do this using Comparison Operators.
Comparison Operators compare two values and produce an output which is either true or false.
For example, suppose we have two variables which are both numeric (i.e., they both hold numbers):
examPasses
and
totalStudents
If we compare them, there are two possible outcomes:
They have the same value
They do not have the same value
Therefore, we can make statements like these:
They are the same
They are the different
The first is larger than the second
The first is smaller than the second
... and then perform a comparison to determine whether the statement is true or false.
The basic comparison operator is:
==
(i.e., two equals signs, one after the other with no space in between).
It means 'is equal to'. Compare this with the assignment operator, =
, which means 'becomes equal to'. The assignment operator makes two things equal to one another, the comparison operator tests to see if they are already equal to one another.
Here's an example showing how the comparison operator might be used:
examPasses == totalStudents |
|
If examPasses and
totalStudents have
the same value, the comparison would return
true as a result. |
|
If examPasses and
totalStudents have
different values, the comparison would return
false as a result. |
Another comparison operator is:
!=
(i.e., an exclamation mark followed by an equals sign, with no space in between).
It means 'is NOT equal to'.
For example:
examPasses != totalStudents |
|
If examPasses and
totalStudents have
the same value, the comparison would return
false as a result. |
|
If examPasses and
totalStudents have
different values, the comparison would return
true as a result. |
Two other commonly-used comparison operators are:
<
and
>
< |
means 'less than' | |
> |
means 'greater than' |
For example:
examPasses < totalStudents |
|
If examPasses is
less than totalStudents ,
the comparison would return true
as a result. |
|
If examPasses is
more than totalStudents ,
the comparison would return false
as a result. |
Another example:
examPasses > totalStudents |
|
If examPasses is
more than totalStudents ,
the comparison would return true
as a result. |
|
If examPasses is
less than totalStudents ,
the comparison would return false
as a result. |
As with some of the other 0perators we have encountered, comparison operators can be combined in various ways.
<=
means
'less than or equal to'.
For example:
examPasses <= totalStudents |
|
If examPasses is
less than or equal to
totalStudents , the comparison would return
true as a result. |
|
If examPasses is
more than totalStudents ,
the comparison would return
false as a result. |
Also:
>=
means
'greater than or equal to'.
For example:
examPasses >= totalStudents |
|
If examPasses is
more than or equal to
totalStudents >, the comparison would return
true as a result. |
|
If examPasses is
less than totalStudents ,
the comparison would return false
as a result. |
To summarise, JavaScript understands the following comparison operators:
== |
'is equal to' | |
!= |
'is NOT equal to' | |
< |
'is less than' | |
> |
'is greater than' | |
<= |
'is less than or equal to' | |
>= |
'is greater than or equal to' |
Much of the power of programming languages comes from their ability to respond in different ways depending upon the data they are given.
Thus all programming languages include statements which make 'decisions' based upon data.
One form of decision-making statement is the If...Else
statement.
It allows us to make decisions such as:
If I have more than £15 left in my account, I'll go to the cinema. | |
Otherwise I'll stay at home and watch television. |
This might be expressed in logical terms as:
If ( money > 15) go_to_cinema | |
Else watch_television |
The If-Else statement in JavaScript has the following syntax:
if (condition)
{
statement;
statement
}
else
{
statement;
statement
};
The condition is the information on which we are basing the decision. In the example above, the condition would be whether we have more than £15. If the condition is true, the browser will carry out the statements within the if...
section; if the condition is false it will carry out the statements within the else...
section.
The if...
part of the statement can be used on its own if required. For example:
if (condition)
{
statement;
statement
};
Note the positioning of the semi-colons.
If you are using both the if...
and the else...
parts of the statement, it is important NOT to put a semi-colon at the end of the if...
part. If you do, the else...
part of the statement will never be used.
A semi-colon is normally placed at the very end of the if...else...
statement, although this is not needed if it is the last or only statement in a function.
A practical If-Else statement in JavaScript might look like this:
if (score > 5)
{
alert("Congratulations!")
}
else
{
alert("Shame - better luck next time")
};
for
LoopA for
loop allows you to carry out a particular operation a fixed number of times.
The for
loop is controlled by setting three values:
- | an initial value | |
- | a final value | |
- | an increment |
The format of a for
loop looks like this:
for (initial_value; final_value; increment)
{
statement(s);
}
A practical for
loop might look like this:
for (x = 0; x <= 100; x++)
{
statement(s);
}
Note that:
* | The loop condition is tested using a variable,
x , which is initially set to
the start value (0 ) and then
incremented until it reaches the final value
(100 ). |
|
* | The variable may be either incremented or decremented. | |
* | The central part of the condition, the part specifying
the final value, must remain true throughout the required
range. In other words, you could not use x = 100
in the for loop above because then the
condition would only be true when x was either 0 or 100,
and not for all the values in between. Instead you should
use x <= 100 so that the
condition remains true for all the values between 0 and
100. |
Here are some practical examples of for
loops.
The first example is a simple loop in which a value is incremented from 0 to 5, and reported to the screen each time it changes using an alert box. The code for this example is:
for (x = 0; x <= 5; x++)
{
alert('x = ' + x);
}
Note that if you enter a correct value immediately, the while
loop never executes. The condition is false the first time it is tested, so the loop never begins.