Science, Maths & Technology
Author:

Booleans and the Comparison Operators

Updated Wednesday, 24th June 2015

Learn how to write boolean expressions for use in JavaScript.

This page was published over five years ago. Please be aware that due to the passage of time, the information provided on this page may be out of date or otherwise inaccurate, and any views or opinions expressed may no longer be relevant. Some technical elements such as audio-visual and interactive media may no longer work. For more detail, see our Archive and Deletion Policy

Boolean Expressions

Copyright: Dreamstime Because we are interested in whether certain conditions are true or false, we begin by considering the Boolean data type, which consists of just two values, represented in JavaScript by the reserved words true and false (remember that JavaScript is case sensitive!).

A condition (or expression) which returns a Boolean value is called a Boolean expression. Before you can do any conditional (if) statements, you first need to learn how to use boolean expressions.

In the last section, we looked at some arithmetic operators, for example, + and *, and also the operation of concatenation, represented by +, on strings. All these operators act on two values of the same type and return a third value of the same type: adding two numbers will give a third number; concatenating two strings will give a third string.

When writing conditions in JavaScript, we make use of a number of operators called comparison operators. These act on (compare) two values of the same type, such as two numbers or two strings, but they always return a Boolean value, either true or false, depending on whether the condition is true or false.

Activity 1

The code which follows is the JavaScript code from booleans_activity_1.html.

var firstValue,secondValue;
var firstBool,secondBool;

firstValue = parseFloat(firstValue);
secondValue = parseFloat(secondValue);
firstBool = (firstValue < secondValue);
secondBool = (firstValue <= secondValue);
document.write('It is ' + firstBool + ' that '+ firstValue + ' < '
+ secondValue);
document.write('<BR>' + 'It is ' + secondBool + ' that '+ firstValue
+ ' <= ' + secondValue);

Note that when you want to declare several variables, you can put them all on the same line consisting of the reserved word var followed by the names of each of the variables, separated by commas. However, we recommend that you put variables of different kinds on different lines, as we have done above.

Run booleans_activity_1.html with the following inputs and note your results:

(a) 3 for the first value and 5 for the second.
(b) 117 for the first value and 32 for the second.
(c) 2 for both values.
(d) What do you think is meant by the symbols < and <=?

Solution

(a) The output should be:

It is true that 3 < 5
It is true that 3 <= 5

(b) The output should be:

It is false that 117 < 32
It is false that 117 <= 32

(c) The output should be

It is false that 2 < 2
It is true that 2 <= 2

(d) The Boolean expression (a < b) evaluates to true if the number a is less than the number b; otherwise, it evaluates to false. The Boolean expression (a <= b) evaluates to true if the number a is less than the number b or the number a equals the number b; otherwise, the value of (a <= b) evaluates to false.

Comparison Operators

Here's a table with the full set of comparison operators that you can use in JavaScript.

Operator symbol Informal Description Discussion Examples

<

less than (a < b) is true if the value of a is less than the value of b, othewise it is false

(3 < 5)

(7 < 2)

(3 < 3)

true

false

false

<=

less than or equal to (a <= b) is true if the value of a is less than the value of b, or is equal to the value of b, otherwise it is false

(2 <= 5)

(2 <= 1)

(2 <= 2)

true

false

true

>

greater than (a > b) is true if the value of a is greater than the value of b, otherwise it is false

(2 > 3)

(2 > 1)

(2 > 2)

false

true

false

>=

greater than or equal to (a >= b) is true if the value of a is greater than the value of b, or is equal to the value of b, otherwise it is false

(3 >= 2)

(3 >= 5)

(3 >= 3)

true

false

true

==

equal to (a == b) is true if the value of a is equal to the value of b, otherwise it is false

(2 == 3)

(2 == 2)

false

true

!= not equal to (a != b) is true if the value of a is not equal to the value of b, otherwise it is false

(3 != 2)

(2 != 3)

(2 != 2)

true

true

false

All the JavaScript symbols in the left-hand column represent single operators, so where there are two characters, e.g. <= and !=, leaving a space between them will cause a syntax error.
Note the use of a 'double equals' (==) symbol for the equality operator. This distinguishes it from the assignment operator =.

If you are unfamiliar with the 'greater than' or 'less than' symbols, it may help you to remember which way round they go if you bear in mind that the larger value goes at the open end of the <, the smaller value at the pinched end, i.e. (smaller < larger) is true.

Remember that if (c < d) is true, then (d > c) is true, and if (c <= d) is true, then (d >= c) is true.

Question: Which of the comparison operators are binary operators?

They are all binary operators, as all of them operate on two values.

Now see if you can determine whether the following comparisons (in JavaScript notation) evaluate to true or false.

(a)    (8 <= 2)
(b)    ((16 != (4*4))
(c)    (16 != 8)
(d)    (13 > 5)
(e)    (16 == (4*4))

(a)    false
(b)    false
(c)    true
(d)    true
(e)    true

The above examples considered only numerical values, but we can use the comparison operators on any values which are ordered, i.e. when we can clearly decide which one comes before the other. For example, the letter a comes before the letter c in the alphabet, so ('a' < 'c') is true. (Remember that we need the quotes in JavaScript when dealing with strings, albeit strings with only a single character in this case.)

Comparisons on strings consisting of all lower-case or all upper-case letters work by comparing the first letter in each string, then, if they are the same, the second letter in each string, and so on. This results in the same order as you would find in a dictionary. For example, ('aardvark' < 'cat') and ('cat' < 'cave') are true, but ('cat' < 'camel') is false, because the first two letters match, but the third letter of 'cat' comes after the third letter of 'camel'.

For numeric strings a string beginning with '1' is considered to be ‘less than’ a string beginning with '2', which is ‘less than’ a string beginning with '3', and so on.

Activity 2

(a) Open the file in your text editor and modify the code so that the program will compare strings rather than numbers. Save your changes, and run the program in your browser to compare some strings of your choice.

(b) What happens now when you input 117 as your first value and 32 as your second?

(c) Can you explain the result you got in part (b)?

Solution

(a) In order to compare strings, you must delete the two statements involving parseFloat().

(b) When you input 117 as your first value and 32 as your second, you get the following output.

It is true that 117 < 32
It is true that 117 <= 32

(c) The result in part (b) is because the values are being treated as the strings '172' and '32', rather than as the corresponding numbers, and, as discussed above, any string beginning with '1' comes before any string beginning with '3' in the ordering of numeric strings.

Now that you are able to discover whether something is true or false, you can now use this information to carry out an if statement. We cover this in Simple Conditional Statements, which it is recommended you read next.