JavaScript Comparison and Logical Operators
Comparison and Logical operators are used to test for true or false.
Comparison Operators
Comparison operators are used in logical statements to determine equality or difference between variables or values.
Given that x = 5, the table below explains the comparison operators:
| Operator | Description | Comparing | Returns | Try it |
|---|---|---|---|---|
| == | equal to | x == 8 | false | Try it » |
| x == 5 | true | Try it » | ||
| x == "5" | true | Try it » | ||
| === | equal value and equal type | x === 5 | true | Try it » |
| x === "5" | false | Try it » | ||
| != | not equal | x != 8 | true | Try it » |
| !== | not equal value or not equal type | x !== 5 | false | Try it » |
| x !== "5" | true | Try it » | ||
| x !== 8 | true | Try it » | ||
| > | greater than | x > 8 | false | Try it » |
| < | less than | x < 8 | true | Try it » |
| >= | greater than or equal to | x >= 8 | false | Try it » |
| <= | less than or equal to | x <= 8 | true | Try it » |
How Can it be Used
Comparison operators can be used in conditional statements to compare values and take action depending on the result:
if (age < 18) text = "Too young";
You will learn more about the use of conditional statements in the next chapter of this tutorial.
Logical Operators
Logical operators are used to determine the logic between variables or values.
Given that x = 6 and y = 3, the table below explains the logical operators:
| Operator | Description | Example | Try it |
|---|---|---|---|
| && | and | (x < 10 && y > 1) is true | Try it » |
| || | or | (x == 5 || y == 5) is false | Try it » |
| ! | not | !(x == y) is true | Try it » |
Conditional (Ternary) Operator
JavaScript also contains a conditional operator that assigns a value to a variable based on some condition.
Syntax
variablename = (condition) ? value1:value2
Example
var
voteable = (age < 18) ? "Too young":"Old enough";
Try it Yourself »
If the variable age is a value below 18, the value of the variable voteable will be "Too young", otherwise the value of voteable will be "Old enough".
Comparing Different Types
Comparing data of different types may give unexpected results.
When comparing a string with a number, JavaScript will convert the string to a number when doing the comparison. An empty string converts to 0. A non-numeric string converts to NaN which is always false.
| Case | Value | Try |
|---|---|---|
| 2 < 12 | true | Try it » |
| 2 < "12" | true | Try it » |
| 2 < "John" | false | Try it » |
| 2 > "John" | false | Try it » |
| 2 == "John" | false | Try it » |
| "2" < "12" | false | Try it » |
| "2" > "12" | true | Try it » |
| "2" == "12" | false | Try it » |
When comparing two strings, "2" will be greater than "12", because (alphabetically) 1 is less than 2.
To secure a proper result, variables should be converted to the proper type before comparison:
age = Number(age);
if (isNaN(age)) {
voteable = "Error in input";
} else {
voteable = (age < 18) ? "Too young" : "Old enough";
}
Try it Yourself »
JavaScript Bitwise Operators
Bit operators work on 32-bit numbers.
Any numeric operand in the operation is converted into a 32-bit number.
The result is converted back to a JavaScript number.
| Operator | Description | Example | Same as | Result | Decimal |
|---|---|---|---|---|---|
| & | AND | x = 5 & 1 | 0101 & 0001 | 0001 | 1 |
| | | OR | x = 5 | 1 | 0101 | 0001 | 0101 | 5 |
| ~ | NOT | x = ~ 5 | ~0101 | 1010 | 10 |
| ^ | XOR | x = 5 ^ 1 | 0101 ^ 0001 | 0100 | 4 |
| << | Left shift | x = 5 << 1 | 0101 << 1 | 1010 | 10 |
| >> | Right shift | x = 5 >> 1 | 0101 >> 1 | 0010 | 2 |
 |
The table above use 4 bits unsigned examples. But JavaScript uses 32-bit signed numbers.
Because of this, in JavaScript, ~ 5 will not return 10. It will return -6: ~00000000000000000000000000000101 will return 11111111111111111111111111111010 |
|---|
Test Yourself with Exercises!
Exercise 1 » Exercise 2 » Exercise 3 » Exercise 4 » Exercise 5 » Exercise 6 »
