When we start learning JS, after variables, we first encounter the operators. When some variables are declared, you need to perform some operations on those variables. Operators help to do some calculations, comparisons, or make decisions on variables.
In this blog, we will understand operators with simple examples.
What are Operators?
Operators are nothing but the symbols that perform operations. Let's take an example:
const a = 10;
const b = 20;
const c = a + b;
console.log(c); // 30
Here, + is the operator.
What are Operands?
Variables on which operation is done, are called operands.
const a = 10;
const b = 20;
const c = a + b;
Here:
a is left operand
b is right operand
Types of Operators
In JS, there are multiple types of operators, but we will cover the basic, mandatory operators in this blog.
Arithmetic operators (+, -, *, /, %)
Comparison operators (==, ===, !=, >, < , >=, <= )
Logical operators (&&, ||, !)
Assignment operators (=, +=, -=)
Let's understand them one by one:
Arithmetic Operators
These are used for basic mathematical operations.
Operator | Meaning | Expression | Result |
|---|
+ | Addition | 9 + 3 | 12 |
- | Substraction | 9 - 3 | 6 |
* | Multiplication | 9 * 3 | 27 |
/ | Division | 9 / 3 | 3 |
% | Remainder | 10 % 3 | 1 |
Comparison operators
These operators are used for comparison between two values and return a Boolean (true/false) value.
Operator | Meaning | Expression | Example |
|---|
== | Equals (loose comparison) | "5" == 5 | true |
=== | Equals (strict comparison) | "5" === 5 | false |
!= | Not equal (loose comparison) | "5" != 5 | false |
!== | Not equal (strict comparison) | "5" !== 5 | true |
< | Less than | 5 < 10
5 < 5 | true
false |
<= | Less than or equal to | 5 <= 10
5 <= 5 | true
true |
> | Greater than | 5 > 2
5 > 5 | true
false |
>= | Greater than or equal to | 5 >= 2
5 >= 5 | true
true |
Understanding loose and strict comparison is very important.
Why "5" == 5 gives a result of true?
When there is == operator, JS first converts the value to the same type before comparison.
Which means "5" (string) is first converted to 5 (number) and then 5 == 5 comparison gives true result.
Whereas in === strict comparison, JS does not change the type of both left and right operands and compares both the type and value.
On the left side, there is a string operand and on the right side, there is a number operand. That's why in a strict case it will give a false result.
Logical operators
These operators help in combining the conditions.
&&
This is also known as AND operator.
Truthy Table
A | B | Expression | Result |
|---|
true | true | true && true | true |
false | true | false && true | false |
true | false | true && false | false |
false | false | false && false | false |
By analysing the truthy table, we can see that even if one side of expression is false, the final result is false. In order to get true, both side values should be true.
||
This is also known as OR operator
Truthy Table
A | B | Expression | Result |
|---|
true | true | true || true | true |
false | true | false || true | true |
true | false | true || false | true |
false | false | false || false | false |
Here we can see that if either side of the operator is true, the final result will be true. Only in the case of both sides of values to being false gives the false result.
!
This is known as the NOT operator. As the name suggests, it reverses the given value.
Truthy Table
A | Expression | Result |
|---|
true | !true | false |
false | !false | true |
Assignment Operators
These operators are used to assign values to variables.
- =
This is known as assign operator. It is used to assign a value to a variable.
let a;
a = 10;
console.log(a); // prints 10
- +=
This is known as Add and assign operator
let a;
a = 10;
console.log(a); // prints 10
a += 5; // Adding 5 to a variable value and assing back
console.log(a) // prints 15
- -=
This is known as the Subtract and assign operator
let a;
a = 10;
console.log(a); // prints 10
a -= 5; // Subtracy 5 from the variable value and assing back
console.log(a) // prints 5
Final thoughts
JavaScript operators are the building blocks of logic and calculations in your code. Mastering these will make your JavaScript journey much easier.
To learn JS from fundamentals to advanced, follow this series https://blog.ashishkumarsaini.dev/series/javascript-for-beginners
