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:
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 to buy alcohol";
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:
&& | 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
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
.
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 = "Input is not a number";
} else {
voteable = [age < 18] ? "Too young" : "Old enough";
}
Try it Yourself »
The Nullish Coalescing Operator [??]
The ??
operator returns the first argument if it is null
or undefined
. Otherwise it returns the second.
Example
let name = null;
let text = "missing";
let result = name ?? text;
Try it Yourself »
The nullish operator is supported in all browsers since March 2020:
Chrome 80 | Edge 80 | Firefox 72 | Safari 13.1 | Opera 67 |
Feb 2020 | Feb 2020 | Jan 2020 | Mar 2020 | Mar 2020 |
The Optional Chaining Operator [?.]
The ?.
operator returns undefined
if an object is undefined
or null
[instead of throwing an error].
Example
// Create an object:
const car = {type:"Fiat", model:"500", color:"white"};
// Ask for car name:
document.getElementById["demo"].innerHTML = car?.name;
Try it Yourself »
The optional chaining operator is supported in all browsers since March 2020:
Chrome 80 | Edge 80 | Firefox 72 | Safari 13.1 | Opera 67 |
Feb 2020 | Feb 2020 | Jan 2020 | Mar 2020 | Mar 2020 |
Comparison and Logical operators are used to test for true
or false
.
Nội dung chính Show
- Comparison Operators
- How Can it be Used
- Logical Operators
- Conditional [Ternary] Operator
- Comparing Different Types
- JavaScript Comparison Operators
- Example 1: Equal to Operator
- Example 2: Not Equal to Operator
- Example 3: Strict Equal to Operator
- Example 4: Strict Not Equal to Operator
- Example 5: Greater than Operator
- Example 6: Greater than or Equal to Operator
- Example 7: Less than Operator
- Example 8: Less than or Equal to Operator
- JavaScript Logical Operators
- Example 9: Logical AND Operator
- Example 10: Logical OR Operator
- Example 11: Logical NOT Operator
- Which is the comparison operator?
- What is comparison operator with example?
- What is === in JavaScript?
- What is a comparison operator in programming?
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:
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 to buy alcohol";
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:
&& | 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
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
.
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 = "Input is not a number";
} else {
voteable = [age < 18] ? "Too young" : "Old enough";
}
Try it Yourself »
JavaScript Comparison Operators
Comparison operators compare two values and give back a boolean value: either true
or false
. Comparison operators are used in decision making and loops.
==
| Equal to: true if the operands are equal
| 5==5; //true
|
!=
| Not equal to: true if the operands are not equal
| 5!=5; //false
|
===
| Strict equal to: true if the operands are equal and of the same type
| 5==='5'; //false
|
!==
| Strict not equal to: true if the operands are equal but of different type or not equal at all
| 5!=='5'; //true
|
>
| Greater than: true if the left operand is greater than the right operand
| 3>2; //true
|
>=
| Greater than or equal to: true if the left operand is greater than or equal to the right operand
| 3>=3; //true
|
2]; // true
Example 6: Greater than or Equal to Operator
Example 7: Less than Operator
Chủ Đề |