The operator is a symbol that performs a specific operation on one or more operands (values or variables) and produces a result. Operators are an essential part of any programming language and are used to manipulate data and variables. These are the different types of operators we are going to talk about in this article.
Assignment Operator
Arithmetic Operator
Comparison Operator
Logical Operator
Ternary Operator
An operand is a value or variable on which an operator performs an operation.
Assignment Operator
The assignment operator = is used to assign value to a variable. The value of the right operand is assigned to the left operand.
let age = 36 // here 36 will be assigned to variable age.
let fruits = ['Banana',"grapes","guava"]
Arithmetic Operator
We can perform standard arithmetic operations on numbers using the arithmetic operators in JavaScript. Following are some of the many arithmetic operators in JavaScript.
Addition
+Subtraction
-Multiplication
*Division
/Modulus
%(also known as remainder)Increment
++Decrement
--
Addition
The addition operator is used when we want to find the sum of two or more numbers.
console.log(5 + 5); // 10
We can also use the Addition operator to join two or more strings together, This is known as string concatenation.
let firstName = "John ";
let lastName = "Kumar";
console.log(firstName + lastName); // John Kumar
Subtraction
The subtraction operator is used to find the difference between numbers.
console.log(55 - 2); //53
console.log(55.235 - 23.87); //31.365
console.log(10 - 2 + 5); // 13 This is definitely wrong answer according to bodmas rule.
In the above example, line 3 is giving us the wrong answer because of the order of precedence. Both addition and subtraction have the same order of precedence so they are evaluated Right to the left that's why subtraction is being evaluated first. Here is how we can correct that.
console.log(10 - (2 + 5)); // 3
Now the expression inside the parenthesis will be evaluated first because of the order of precedence.
Division (/)
The division operator is used to find the quotient.
console.log(55 / 5); // 11
Modulus(%)
The modulus operator is used to find the remainder.
console.log(56 % 5); // 1
Increment (++)
The JavaScript increment operator (++) is used to increment (add 1 to) a variable's value. It can be used in both postfix and prefix notation. In postfix notation (i++), the current value of the variable is returned, and then the value is incremented. In prefix notation (++i), the value is incremented first, and then the new value is returned. It's important to note that the increment operator (++) only works on numbers and will result in a NaN if used on a non-numeric value.
let x = 5;
console.log(x++); // Output: 5
console.log(x); // Output: 6
let y = 5;
console.log(++y); // Output: 6
console.log(y); // Output: 6
Decrement (--)
The JavaScript decrement operator (--) is used to decrement (subtract 1 from) a variable's value. It can be used in both postfix and prefix notation. In postfix notation (i--), the current value of the variable is returned, and then the value is decremented. In prefix notation (--i), the value is decremented first, and then the new value is returned.
let x = 5;
console.log(x--); // Output: 5
console.log(x); // Output: 4
let y = 5;
console.log(--y); // Output: 4
console.log(y); // Output: 4
Comparison Operator
A comparison Operator is used to compare two or more operands. These are the different types of comparison operators.
Equal (==)
The equal operator returns ture if both the operands are the same, it does not check the type of the operands.
const var1 = 10;
const var2 = 20;
const var3 = "10";
const var4 = 10;
console.log(var1 == var2); // false
console.log(var1 == var3); // true both variable have same value but they are of different type
console.log(var1 == var4); //true
Strict equal (===)
This operator is the same as the equal operator, but it also checks the type of operands.
const var1 = 10;
const var2 = 20;
const var3 = "10";
const var4 = 10;
console.log(var1 === var2); // false --different value
console.log(var1 === var3); // false --because both value is of different type
console.log(var1 === var4); //true --same value same type
Not Equal (!=)
This operator returns true if the operands are not equal and return false if they are equal.
const var1 = 10;
const var2 = 20;
const var3 = "10";
const var4 = 10;
console.log(var1 != var2); // true -- different value
console.log(var1 != var3); // false -- same value
console.log(var1 != var4); //false -- same value
Strict Not Equal (!==)
This operator returns true if the operands are not equal and of the same type, else it returns false.
const var1 = 10;
const var2 = 20;
const var3 = "10";
const var4 = 10;
console.log(var1 !== var2); // true -- different values
console.log(var1 !== var3); // true -- same value, different type
console.log(var1 !== var4); // false -- same value, same type
Few More (>,>=,<,<=)
const var1 = 10;
const var2 = 20;
const var3 = 10;
// Greater than
console.log(var1 > var2); // false
console.log(var2 > var1); //true
// Less than
console.log(var1 < var2); // true
console.log(var2 < var1); // false
// Greater than or equal
console.log(var1 >= var2); // false
console.log(var2 >= var1); // true
console.log(var1 >= var3); // true
// Less than or equal
console.log(var1 <= var2); // true
console.log(var2 <= var1); // false
console.log(var1 <= var3); // true
| Operator | Description | Example |
|---|---|---|
| Greater Than (>) | Return true if the left operand is greater than the right operand |
see the above code example. |
| Less Than(<) | Returns true if the left operand is less than the right operand |
see the above code example. |
| Greater Than or Equal (>=) | Evaluates to true if the value on the left is greater than or equal to the value on the right. |
see the above code example. |
| Less Than or Equal(<=) | Evaluates to true if the value on the left is less than or equal to the value on the right. |
see the above code example. |
Logical Operator
A logical operator evaluates expressions and returns a boolean value indicating whether a specific condition is true or false. When used with boolean operands, these operators will return a boolean result; when used with non-boolean values, they will produce a non-boolean result. There are three different types of logical operators in JavaScript.
OR (||)
AND (&&)
NOT(!)
OR
The OR the operator is represented by a double vertical line || . OR The operator returns true if any of its expressions evaluates to true otherwise, it returns false. If the OR operator is used with non-boolean values then it returns non-boolean values.
Syntax:
expression1 || expression2
if expression 1 is evaluated to true then it returns expession 1 otherwise exprssion2
logical OR expression is evaluated left to right, so if the first expression is evaluated to true, then it doesnot check the next expression.
if all the expression evaluates to false then it reaturn false.
const var1 = 10;
const var2 = 20;
const var3 = 10;
console.log(var1 > var2 || var2 > var1);// true
console.log(true || true); // true
console.log(false || true); // true
console.log(true || false); // true
console.log(false || false); // false
AND (&&)
The AND operator is represented by two ampersands && sign. The AND operator return true if all of its conditions evaluates to true if any of its conditions evaluates to false it returns false.
Syntax:
expression 1 && expression 2
returns
trueif both the conditions if true otherwise it returnsfalseAND operator is evaluated from left to right, so if any expression evaluates to false it doesn't evaluates any expression after that.
it returns last last operand if all the expression evalutes to 'true`
`javascript
const var1 = 10;
const var2 = 20;
const var3 = 10;
console.log(var1 > var2 && var2 > var1); // false && true
console.log(true && true); // true
console.log(false && true); // false
console.log(true && false); // false
console.log(false && false); // false
`
NOT (!)
The NOT the operator is represented by an explanation ! sign. The ! operator can be applied to boolean and non-boolean values. When used with a boolean value, it returns the opposite of that value, i.e. if the value is false it returns true, and if the value is true it returns false.
javascript
console.log(!true); //false
console.log(!false); //true
console.log(!0); //true
console.log(!"Hello"); // false
Ternary Operator
Ternary Operator takes three operands and returns values based on the condition.
Syntax:
condition ? expression 1 : expression2
- if the condition is true then it returns expression1 and if the expression if false it returns expression2
`javascript
const var1 = 10;
const var2 = 20;
console.log(var2 > var1 ? "true" : "false"); // true
console.log(var1 > var2 ? "true" : "false"); // false
`
Conclusion
In this article I have only talked about the operators which are used most, there are a few more operators, and if you want to explore more then you can read about them here.
Top comments (0)