TypeScript Comparison and Logical Operators

Note: If you're new to TypeScript, check our Getting Started with TypeScript tutorial first.

TypeScript Comparison Operators

Comparison operators compare two values and return a boolean result (true or false). For example,

const a: number = 3, b: number = 2;

console.log(a > b);

// Output: true 

Here, we have used the > comparison operator to check whether a (whose value is 3) is greater than b (whose value is 2).

Since 3 is greater than 2, we get true as output.

Note: In the above example, a > b is called a boolean expression since evaluating it results in a boolean value.

Commonly Used Comparison Operators

1. TypeScript Equal To Operator

The equal to operator == evaluates to

• true - If the values of the operands are equal.
• false - If the values of the operands are not equal.

For example,

const greeting1: string = "hello";
const greeting2: string = "Hello";

// Comparing different values of string type
console.log(greeting1 == greeting2);  // false

// Comparing a string variable with a string literal
console.log(greeting1 == "hello");  // true
const myAge: number = 25;
const yourAge: number = 25;

// Comparing identical values of number type
console.log(myAge == yourAge);  // true

// Comparing a number variable with a numerical literal
console.log(myAge == 36);  // false

Here's how this program works:

Note: In TypeScript, == is a comparison operator, whereas = is an assignment operator. If you mistakenly use = instead of ==, you might get unexpected results.

const greeting: string = "hello";
const age: number = 25;

// Comparing string and number results in error
console.log(greeting == age);

// Comparing two numerical literals that are identical in value
// This is a valid code
console.log(2 == 2);  // true

// Comparing a numerical literal with a string literal
// Gives an error because you can't compare different types
console.log(2 == "2");  // Error

// Comparing two numerical literals with different values
// Gives an error because they are considered different types
console.log(2 == 3);  // Error

2. Not Equal To Operator

The not equal to operator != evaluates to

• true - If the values of the operands aren't equal.
• false - If the values of the operands are equal.

For example,

const myAge: number = 25;
const yourAge: number = 25;

const greeting1: string = "hello";
const greeting2: string = "Hello";

// Comparing variables of same type and different values
console.log(greeting1 != greeting2);  // true

// Comparing variables of same type and same values
console.log(myAge != yourAge);  // false

// Comparing string variable with string literal
console.log(greeting1 != "hello");  // false

// Comparing number variable with numerical literal
console.log(myAge != 36);  // true

// Comparing literals of same type and value
console.log(2 != 2);  // false

Here's how this program works:

Unsafe Comparisons in TypeScript

As you know, there are many unsafe comparisons that are acceptable in JavaScript but might throw errors in TypeScript. Here are a few examples:

// Comparing variables of different types
// console.log(greeting1 != myAge);  // Error

// Comparing variable of one type with literal of another type
// console.log(myAge != "36");  // Error

// Comparing literals of different types
// console.log(2 != "2");  // Error

// Comparing numerical literals with different values
// console.log(2 != 3);  // Error

Here's why this program doesn't work:

3. Strict Equal To Operator

The strict equal to operator === evaluates to

• true - If both the values and the types of the operands are the same.
• false - If either the values or the types of the operands are not the same.

Since TypeScript forbids comparison of different types by default, we'll only look at valid examples:

const myAge: number = 25;
const yourAge: number = 25;
const stringAge: string = "25";

// Comparing identical values of number type
console.log(myAge === yourAge);  // true

// Comparing a number variable and a numerical literal
console.log(myAge === 36);  // false

// Converting stringAge to number and comparing it with myAge
// Valid code because we're comparing two number values
console.log(myAge === Number(stringAge));  // true

4. Strict Not Equal To Operator

The strict not equal to operator !== evaluates to

• true - If either the values or the types of the operands are not the same.
• false - If both the values and the types of the operands are the same.

const myAge: number = 25;
const yourAge: number = 25;
const stringAge: string = "25";

console.log(myAge !== yourAge);  // false

console.log(myAge !== 36);  // true

console.log(myAge !== Number(stringAge));  // false

5. Greater Than Operator

The greater than operator > returns

• true - If the value on the left is greater than the value on the right.
• false - If the value on the left isn't greater than the value on the right.

For example,

const myAge: number = 48;
const yourAge: number = 25;

// Left operand is greater
console.log(myAge > yourAge);  // true

// Both operands are equal
console.log(myAge > 48);  // false

// Left operand is smaller
console.log(36 > 48);  // false

6. Greater Than Or Equal To Operator

The greater than or equal to operator >= returns

• true - If the value on the left is greater than or equal to the value on the right.
• false - If the value on the left is less than the value on the right.

For example,

const myAge: number = 48;
const yourAge: number = 25;

// Left operand is greater
console.log(myAge >= yourAge);  // true

// Both operands are equal
console.log(myAge >= 48);  // true

// Left operand is smaller
console.log(36 >= 48);  // false

7. Less Than Operator

The less than operator < returns

• true - If the value on the left is less than the value on the right.
• false - If the value on the left isn't less than the value on the right.

For example,

const myAge: number = 48;
const yourAge: number = 25;

// Left operand is smaller
console.log(yourAge < myAge);  // true

// Both operands are equal
console.log(myAge < 48);  // false

// Left operand is greater
console.log(48 < 36);  // false

8. Less Than Or Equal To Operator

The less than or equal to operator <= returns

• true - If the value on the left is less than or equal to the value on the right.
• false - If the value on the left is greater than the value on the right.

For example,

const myAge: number = 48;
const yourAge: number = 25;

// Left operand is smaller
console.log(yourAge <= myAge);  // true

// Both operands are equal
console.log(myAge <= 48);  // true

// Left operand is greater
console.log(48 <= 36);  // false

TypeScript Logical Operators

Logical operators return a boolean value by evaluating boolean expressions. For example,

const x: number = 5;
const y: number = 3;

console.log((x < 6) && (y < 5));

// Output: true

Here, && is the logical operator AND. Since both the boolean expressions x < 6 and y < 5 are true, evaluating them with the && operator also results in true.

Commonly Used Logical Operators

1. Logical AND Operator

The logical AND operator && returns true if both the expressions are true. For example,

let x: number = 2;

// Both expressions are true
console.log((x < 4) && (3 >= x));  // true

// Only one expression is true
console.log((x <= 4) && (x == 3));  // false

// Both expressions are false
console.log((x > 4) && (x == 3));  // false

Here,

• (x < 4) && (3 >= x) results in true because both expressions are true.
• (x <= 4) && (x == 3) results in false because the expression x == 3 is false.
• (x > 4) && (x == 3) results in false because both expressions are false.

2. Logical OR Operator

The logical OR operator || returns true if at least one expression is true. For example,

let x: number = 2;

// Both expressions are true
console.log((x < 4) || (3 >= x));  // true

// Only one expression is true
console.log((x <= 4) || (x == 3));  // true

// Both expressions are false
console.log((x > 4) || (x == 3));  // false

Here,

• (x < 4) || (3 >= x) results in true because both expressions are true.
• (x <= 4) || (x == 3) results in true because the expression x <= 4 is true.
• (x > 4) || (x == 3) results in false because both expressions are false.

3. Logical NOT Operator

The logical NOT operator ! returns true if the specified expression is false and vice versa. For example,

let x: number = 2;

// NOT on true
console.log(!true);  // false

// NOT on false
console.log(!false);  // true

// Comparison example
console.log(!(x < 3));  // false

Here,

• !true results in false because ! inverts the value of true to false.
• !false results in true because ! inverts the value of false to true.
• !(x < 3) results in false because ! inverts the true value of (x < 3) to false.

// Less than operator
console.log(4 < 5);

// Output: true

// ! logical NOT
console.log(!(4 < 5));

// Output: false

Also Read:

• TypeScript Operators
• TypeScript if...else Statement
• TypeScript for loop