Operators That Test for Equality

This area is not as straightforward as it seems at first.

The Equality Operators

Operators	Function
==	Tests whether two expressions are equal
!=	Tests whether two expressions are not equal
===	Tests whether two expressions are really equal
!==	Tests whether two expressions are really not equal

Using the Equality Operators

These operators are used in "if" and "while" statements. We'll add those in the next unit but here are some samples showing what they look like.

// Using Equality Operators

if (count === 5) {
  // do something
}

while (count !== 10) {
  // do something
}

---

Boolean Expressions

This sounds more complicated than it really is.

Boolean expressions are just statements that are either true or false.

5 equals 5?

(5 === 5)    True!

"Fred" equals "Barney"?

("Fred" === "Barney")   False!

If a variable named 'count' has a value of 3. What is the result of this expression?

(count === 3)    True!

How about this?

(100 === "100")   ???

We can see the results of an equality test with a simple document.write();

// Displaying a Boolean expression

document.write(5 === 5);
document.write("<br />");
document.write("Fred" === "fred");

---

Testing for Equality with Type Conversion ==

The == operator has a trick. It will convert types to match before it does the equality test.

(100 == "100")   What will this be? It's true!

The "100" will first be converted to the number 100 and then compared to 100.

// Automatic number conversion
document.write(100 == "100");

It does NOT convert the case of strings

// No case conversion
document.write("Fred" == "FRED");

---

You can use variables in the test

// Using variables with equality tests
let firstName;
let enteredName;
let count;
let currentNumber;

firstName = "Fred";
enteredName = "fred";
count = 10;
currentNumber = 10;

document.write(firstName == enteredName);
document.write("<br />");
document.write(count == currentNumber);

---

Testing for Inequality With Type Conversion !=

The != operator will convert types and then test to see if the values are not equal. This can be confusing, if the values are not equal then the test returns true.

The 25 will be converted to "25" and then tested for inequality with the "25". Because they are equal the test will return false.

// Not Equal with conversion
document.write("25" != 25);

This test will return true because 10 is not equal to 11. (Get it?)

// A true example
document.write(10 != 11);

Convert ("Bob" != "Bill") into an assertion: Bob is not the same as Bill. True, they are different.

// Not Equal?
document.write("Bob" != "Bill");

---

Testing for Equality Without Type Conversion ===

The === operator will not do any conversions, it will just do a strict comparison. If the types don't match then you get false. This is the equality operator that we'll use most of the time.

If they are the same type then it's just the same as ==

// Same as ==
document.write(5 === 5);

But this will now return false.

// Strict comparison
document.write(100 === "100");

Coding Standard

This is called "Strict Equality" and is usually what you should use. Only use the non-strict == when you know that's what you want. It is a course standard that you use === whenever possible, unless directed to do otherwise.

---

Testing for Inequality Without Type Conversion !==

The !== tests for inequality with no type conversion.

This works like != with no type conversion, so we often get different results.

// Are they different types? Then it's true.
document.write("25" !== 25); // It's true that "25" is not the same as 25

For numbers it's just the same as !=.

// Comparing number for inequality
document.write(10 !== 11); // 10 is different from 11

The problem with == (And why you shouldn't use it).

• JavaScript's auto-conversion can sometimes give us unexpected results.
• Here's an example. What do you think this should be?

('' == 0)  true or false?

// Did you guess right?
document.write('' == 0);

• Is that what we want to happen?
• Not me!
• What happens with ===?

// This is more what we expect to happen
document.write('' === 0);

Coding standard

The course standard is to always use === and !== whenever possible.

Read more

Related Reading

Pages 281 - 282

Hands on Work

Labs

1. Testing For Equality
   • unit02/labs/lab-06-testingEquality.html

Exercises

1. Exercise06: Exercise for lab06
   • unit02/exercises/exercise-06.html