JavaScript Comparison

JavaScript supports comparison operators to compare two values. The JavaScript comparison operators take two values, compare them, and return a Boolean result, either true or false. These operators are very useful in decision-making and loop programs in JavaScript.

In programming languages, the operators are used to perform specific mathematical or logical operations to perform an action and provide the required output. All the programming languages, such as C, C++, Java, Python, and other languages, support these operators. We can use them to determine any logical operations and check conditions.

In this section, we will discuss the comparison and logical operators available in JavaScript with their examples. Further, we will see multiple examples to determine the condition-based output and the difference between values.

List of Comparison Operators in JavaScript

The following is a list of the comparison operators supported by JavaScript:

Note: The output of these will always be either true or false based on the assigned variable value. We will illustrate this in the examples sections of this article.

Operator	Name	Example	Return Value
==	Equal to	a==b	True or false
		a==3	True or false
		a=="3"	True or false
===	Equal value and types	a===b	True or false
		a===="3"	True or false
!=	Not equal to	a!=b	True or false
!==	Not equal to and types	a!==b	True or false
		a!=="b"	True or false
>	Greater than	a>b	True or false
<	Less than	a<b	True or false
>=	Greater than or equal to	a>=b	True or false
<=	Less than or equal to	a<=b	True or false

The logical operators can be bound with the comparison operators to create various use cases. Let's see the available logical operators in JavaScript:

Logical Operators in JavaScript

The following are the logical operators supported by JavaScript:

Operator	Name	Example
&&	Logical And	( a< 5 && b>2)
\|\|	Logical Or	(a<5 \|\| b>2)
!	Not	(a!=5)

Ternary (Conditional) Operator

JavaScript also supports a conditional operator, known as the ternary operator, specifying whether the output is true or not based on a condition. It is represented by the "?" symbol.

Below is the syntax of the JavaScript ternary operator:

Variable_name = (condition) ? value1:value2

Let's understand these operators in detail with the following examples:

Example1: Equal to operator

The Equal to the operator is used to check whether the value is equal. Consider the below example:

	function myFunction(){
  const a=3;
  console.warn(a==3)
  }

Output:

true

Similarly, if we test the below example, it will return the false:

function myFunction(){
  const a=3;
  console.warn(a==5)
  }

Output:

false

Example2: Equal Value and Types (Strict Equal to)

The "===" operator compares the variable's value and data types. It will return true if the value and data type are the same. For example, if we compare a===3 and a==="3", then in the first case, it will return true if the assigned value of a is 3, and in the second case, it will return false.

Consider the below example:

function myFunction(){
  const a=3;
  console.warn(a===3)
  }

Output:

true

Now, check with string values:

function myFunction(){
  const a=3;
  console.warn(a==="3")
  }

Output:

false

The difference between equal to (==) and strict equal to (===) is that equal to evaluates the value only comparatively the strict equal to operator check against the data types too. For example, if we perform the above example with equal to the operator, it will return true:

function myFunction(){
  const a=3;
  console.warn(a=="3")
  }

Output:

true

Example3: Not Equal to (!=)

The not equal to the operator is just the opposite of equal to it will test if the value is not equal to the specified operator and return the output true or false accordingly.

function myFunction(){
  const a=3;
  console.warn(a!="5")
  }

Output:

true

Example4: Not Equal to and types (!==)

The not equal to and types (!==) strictly compares two values with their values and data types, if they are not equal, then it will return true. It is just opposite to the strict equal to operator.

Consider the below example:

function myFunction(){
 const a = 3, b = 'test';

// strict not equal operator
console.warn(a !== 3); // false
console.warn(a !== '3'); // true
console.warn(b !== 'Test'); // true
  }

Output:

false
true
true

From the above output, we can see when it finds the value and datatype both the same, it is returning the false otherwise, it is returning true.

Example5: Greater than (>) and Less than (<) operators

The greater than (>) operator returns true if the left operand value is greater than the right operand; otherwise, it will return false.

The less than (<) operator returns true if the left operand value is less than the right operand; otherwise, it will return false.

Consider the below example:

function myFunction(){
 const a = 3, b = 5;
console.warn(a>b); // false
console.warn(a<b); // true
  }

Output:

false
true

From the above output, we can see that the greater than operator returns false when the value of a is less than b, and the less than operator returns true when the value of a is less than b.

Example6: Greater than or equal to (>=) and Less than or equal to (<=)

The greater than or equal to the operator will return true if one of two conditions is true. It should be greater than or equal.

Similarly, the less than or equal to the operator will return if the values are less than or equal.

Consider the below example:

function myFunction(){
 const a = 3, b = 3, c=5;

// strict not equal operator
console.warn(a>=b); // true
console.warn(a>=c); // false
console.warn(a<=c); // true
  }

Output:

true
false
true

From the above output, we can see when the conditions match, these operators provide output accordingly.

JavaScript Logical Operators

There are three logical operators in JavaScript: AND, OR, and NOT. These operators are used to perform logical operations.

Example7: Logical And operator (&&)

The logical And operator is used to bind two conditions; it will only return true if both the conditions are true. Consider the below example:

function myFunction(){
 const a = 3, b = 3, c=5;
console.warn((a<=c) && (a===b) ); // true
console.warn((c>=a) && (c===5)); // true
console.warn((c>=b) && (c==4)); // false
  }

Output:

true
true
false

From the above output, the logical And operator is binding two events together, and it is returning true if and only if both conditions are true.

Example8: Logical OR operator (||)

The logical OR operator checks against two conditions and returns true if one of the two conditions is true. Consider the below example:

function myFunction(){
 const a = 3, b = 3, c=5;
console.warn((a<=c) || (a===b) ); // true
console.warn((c>=a) || (c===5)); // true
console.warn((c==b) || (c==4)); // false
  }

Output:

true
true
false

From the above output, it returns false for the third condition when none of the specified conditions is matched.

Example9: Logical NOT operator (!)

The Logical Not operator reverses the just opposite value of the current operand. For example, if a is true, it will return the value false. Consider the below example:

function myFunction(){
 const a = true, b=false;
 console.warn(!a) // false
 console.warn(!b) //true
  }

Output:

false
true

From the above output, it returns false when the value is true and true when the value is false.

JavaScript Ternary (Conditional) Operator

JavaScript ternary operator is also known as conditional operator. It takes three operands; the first is a condition followed by a question mark (?), then an expression that should be executed if the condition is true, followed by a colon (:), and another expression that should be executed if the condition is false. The ternary operator is an alternative to an if else statement.

Syntax:

Consider the below example:

Example10: Ternary Operator (?)

function myFunction(){
 const age=18, age2=17;
const person1= (age>=18? "Eligible to vote": "Not Eligible")
const person2= (age2>=18? "Eligible to vote": "Not Eligible")
console.log(person1)
console.log(person2)
  }

Output:

Eligible to vote
Not Eligible

From the above output, we can see if the condition is true, then the first code is executed; otherwise second code is executed.

We have discussed comparison operators along with logical and ternary operators. We can use any of these operators together to create logic. Generally, the comparison operators are used with some conditional and logical operators to create the conditional logic.

We can use these operators to validate a form, test the conditions, conditional rendering in JavaScript frameworks, and so on.

Next TopicJavaScript Confirm

← prev next →