TypeScript Logical Operators with Examples

What is a logical operator in TypeScript?

The TypeScript Logical operators are used to merge multiple conditions into a single expression.

Giving a result that is either True or False.

It simply means, logical operators work with a set of operands and produce a result based on those operands.

Typically, they operate on boolean values, returning a boolean result.

However, if the operands are not boolean, logical operators may yield a non-boolean value.

Examples include logical AND (&&), logical OR (||), and logical NOT (!).

Logical AND (&&) operator

The Logical AND (&&) operator returns true only if both conditions are true.

Syntax:

 samplecondition1 && samplecondition2

Here’s an example:

let samplecondition1 = true;
let samplecondition2 = false;

// Using the Logical AND operator
let result = samplecondition1 && samplecondition2; ✅

console.log(result);

In our given example above, the samplecondition2 is false, the result of condition1 && condition2 is false.

Output:

false 

On the other hand, if both samplecondition1 and samplecondition2 were true, the result would be true. This is how the Logical AND (&&) operator works.

Here’s another example:

const x = 10;
const y = 20;

console.log(x > 1 && y > 1); ✅ 
console.log(x > 1 && y < 1); ✅

Output:

true
false

Explanation:

The first condition (x > 1) is true, so the entire expression evaluates to true.
In the second line, both conditions (x > 1 and y < 1) must be true for the result to be true.

However, y is not less than 1, so the overall result is false.

Logical OR (||) operator

The Logical OR (||) operator returns true if either one of the conditions is true.

Here’s an example:

let samplecondition1 = true;
let samplecondition2 = false;

// Using the Logical OR operator
let result = samplecondition1 || samplecondition2; ✅ 
 
console.log(result); 

Output:

true 

Here’s another example:

const x = 10;
const y = 20;

console.log(x > 1 || y > 1); ✅ 
console.log(x > 1 || y < 1); ✅ 

Output:

true
true

Explanation:

In the first line, we use the logical OR operator (||). It returns true if at least one of the conditions is true.

Here:

x > 1 is true (since 10 is greater than 1).

y > 1 is also true (since 20 is greater than 1).

Since at least one condition is true, the result is true.

In the second line:

x > 1 is still true.

y < 1 is false (since 20 is not less than 1).

However, we only need one true condition for the entire expression to be true.

So, the result is still true.

Logical NOT (!) operator

The Logical NOT (!) operator gives the opposite outcome of the expression’s result.

For instance, if the expression is !(>5), it will return false.

Here’s an example:

let condition = true;

// Using the Logical NOT operator ✅
let result = !condition;

console.log(result);

In one example, the condition is true. The Logical NOT (!) operator returns the inverse of the condition.

Output:

false

So, ! the condition is false. Hence, a false is printed to the console.

If the condition were false,! the condition would be true. This is how the Logical NOT (!) operator works.

Remember:

We can be able to combine the Logical Operators AND (&&) and OR (||), however you have to consider the precedence.

Here’s the order of precedence for logical operators with other pertinent operator:

  • Parenthesis or Grouping ( )
  • Logical NOT !
  • Equality ==
  • Not equal !=
  • Strict Equality ===
  • Not strict Equal !==
  • logical AND &&
  • Logical OR ||
  • Nullish coalescing operator ??

Conclusion

So that’s the end of our discussion about TypeScript logical operators, which are used to merge multiple conditions into a single expression, resulting in either true or false.

I hope this article has provided you with insights and helped you understand the logical operators TypeScript.

If you have any questions or inquiries, please don’t hesitate to leave a comment below.

Leave a Comment