JavaScript Operators

Operators are generally the symbols that are used to perform operations on operands. There are following types of operators in JavaScript:

• Arithmetic Operators
• Comparison Operators
• Logical/Relational Operators
• Assignment Operators
• Conditional/Ternary Operators

Lets see these operators in detail:

Arithmetic Operators

These operators are used to perform mathematical operations on numbers. You can also use variables instead of numbers in the below examples.

Operator	Description	Example
+	Addition: Used to add two numbers.	var sum = 10 + 50; // This will return the value: 60
–	Subtraction: Used to subtract two numbers.	var difference = 100 – 80; // This will return 20.
*	Multiplication: Used to multiply two numbers.	var result = 10 * 20; // This will return 200.
/	Division: Used to divide two numbers.	var result = 100/20; // This will return 5.
%	Modulus: Gives the remainder of an integer division..	var result = 100/3; // This will return 1.
++	Increment: Increases the value of a number by one.	var result = +++11; // This will return 12.
—	Decrement: Decreases the value of a number by one.	var result = –11; // This will return 10.

Below is an example demonstrating the usage of Arithmetic Operators:

var num1 = 100, num2 = 30, num3 = 20;
var result;
var linebreak = "<br/>";

document.write("<b><u>Arithmetic Operators</u></b>");
document.write(linebreak);

document.write("<b>Addition Operator (+)</b>");
document.write(linebreak);
result = num2 + num3;
document.write(num2 + " + " + num3 + " = " + result);
document.write(linebreak, linebreak);

document.write("<b>Subtraction Operator (-)</b>");
document.write(linebreak);
result = num2 - num3;
document.write(num2 + " - " + num3 + " = " + result);
document.write(linebreak, linebreak);

document.write("<b>Multiplication Operator (*)</b>");
document.write(linebreak);
result = num2 * num3;
document.write(num2 + " * " + num3 + " = " + result);
document.write(linebreak, linebreak);

document.write("<b>Division Operator (/)</b>");
document.write(linebreak);
result = num1 / num3;
document.write(num1 + " / " + num3 + " = " + result);
document.write(linebreak, linebreak);

document.write("<b>Modulus Operator (%)</b>");
document.write(linebreak);
result = num1 % num2;
document.write(num1 + " % " + num2 + " = " + result);
document.write(linebreak, linebreak);

document.write("<b>Increment Operator (++)</b>");
document.write(linebreak);
document.write("++" + num3 + " = " + ++num3)
document.write(linebreak, linebreak);

document.write("<b>Decrement Operator (--)</b>");
document.write(linebreak);
document.write("--" + num2 + " = " + --num2)

Output of the above code is as follows:

Arithmetic Operators

Addition Operator (+)
30 + 20 = 50

Subtraction Operator (-)
30 – 20 = 10

Multiplication Operator (*)
30 * 20 = 600

Division Operator (/)
100 / 20 = 5

Modulus Operator (%)
100 % 30 = 10

Increment Operator (++)
++20 = 21

Decrement Operator (–)
–30 = 29

Comparison Operator

Comparison Operators are used to compare two values and return true or false. You can use these operators in conditional or loop statements. Below are the various comparison operators supported in JavaScript:

Operator	Description	Example
==	Equal: This operator is used to check the equality of two values.	X == Y // This will return true if X and Y are equal otherwise return false.
!=	Not Equal: This operator is used to check the non-equality of two values.	X != Y // This will return true if X and Y are not equal otherwise return false.
>	Greater Than: This operator is used to check whether a value is greater than another value or not.	X > Y // This will return true if X is greater than Y otherwise return false.
<	LessThan: This operator is used to check whether a value is less than another value or not.	X < Y // This will return true if X is less than Y otherwise return false.
>=	Greater Than or Equal To: This operator is used to check whether a value is greater than or equal to another value or not.	X >= Y // This will return true if X is greater than or equal to Y otherwise return false.
<=	Greater Than: This operator is used to check whether a value is less than or equal to another value or not.	X <= Y // This will return true if X is less than or equal to Y otherwise return false.

Below is an example demonstrating the usage of Comparison Operators:

var num1 = 100, num2 = 30, num3 = 20;
var result;
var linebreak = “<br/>”;

document.write(“<b><u>Comparison Operators</b></u>”);
document.write(linebreak, linebreak);
document.write(“<b>Equal Operator (==)</b>”);
document.write(linebreak);
result = num2 == num3;
document.write(num2 + ” == ” + num3 + ” => ” + result);
document.write(linebreak, linebreak);

document.write(“<b>Not Equal Operator (!=)</b>”);
document.write(linebreak);
result = num2 != num3;
document.write(num2 + ” != ” + num3 + ” => ” + result);
document.write(linebreak, linebreak);

document.write(“<b>Greater Than Operator (>)</b>”);
document.write(linebreak);
result = num2 > num3;
document.write(num2 + ” > ” + num3 + ” => ” + result);
document.write(linebreak, linebreak);

document.write(“<b>Less Than Operator (<)</b>”);
document.write(linebreak);
result = num2 < num3;
document.write(num2 + ” < ” + num3 + ” => ” + result);
document.write(linebreak, linebreak);

document.write(“<b>Greater Than or Equal To Operator (>=)</b>”);
document.write(linebreak);
result = num2 >= num2;
document.write(num2 + ” >= ” + num2 + ” => ” + result);
document.write(linebreak, linebreak);

document.write(“<b>Less Than or Equal To Operator (<=)</b>”);
document.write(linebreak);
result = num2 <= num1;
document.write(num2 + ” <= ” + num1 + ” => ” + result);

Output of the above code is as follows:

Comparison Operators

Equal Operator (==)
30 == 20 => false

Not Equal Operator (!=)
30 != 20 => true

Greater Than Operator (>)
30 > 20 => true

Less Than Operator (<)
30 < 20 => false

Greater Than or Equal To Operator (>=)
30 >= 30 => true

Less Than or Equal To Operator (<=)
30 <= 100 => true

Logical Operators

They are sometimes used to combine two or more conditions. Are also known as Relational Operators. Below are the various Logical Operators supported in JavaScript:

Operator	Description	Example
&&	Logical AND // Returns true if all the conditions are true.	(X && Y) // This will return true if both X and Y are true.
||	Logical OR // Returns true if at least one condition is true	(X || Y) // This will return true if either X or Y is true.
!	Logical NOT //Returns the opposite of the actual result.	(!(X && Y)) // If the result of (X && Y) is true, the the complete statement will return false.

Below is an example demonstrating the usage of Comparison Operators:

var num1 = 100, num2 = 30, num3 = 20;
var result;
var linebreak = “<br/>”;

document.write(“<b><u>Logical Operators</b></u>”);
document.write(linebreak, linebreak);
document.write(“<b>Logical AND (&&)</b>”);
document.write(linebreak);
result = ((num2 > num3) && (num2 < num1));
document.write(“((” + num2 + ” > ” + num3 + ” ) && (” + num2 + ” < ” + num1 + “)) => ” + result);
document.write(linebreak, linebreak);

document.write(“<b>Logical OR (||)</b>”);
document.write(linebreak);
result = ((num2 > num3) || (num2 > num1));
document.write(“((” + num2 + ” > ” + num3 + “) || (” + num2 + ” > ” + num1 + “)) => ” + result);
document.write(linebreak, linebreak);

document.write(“<b>Logical NOT (!)</b>”);
document.write(linebreak);
result = !(num2 > num3);
document.write(“!(” + num2 + ” > ” + num3 + “) => ” + result);

Output of the above code is as follows:

Logical Operators

Logical AND (&&)
((30 > 20 ) && (30 < 100)) => true

Logical OR (||)
((30 > 20) || (30 > 100)) => true

Logical NOT (!)
!(30 > 20) => false

Assignment Operator

Assignment operators are used to assign values to variables. Below are various assignment operators supported by JavaScript:

-=Subtract and Assign // It subtracts the right operand from the left operand and then assigns the result to the left operand.a -= b; // This statement will add a and b and then assigns the sum to result variable.

Operator	Description	Example
=	Simple Assignment // It assigns the right operand to the left operand.	var result = a; // This statement will assign the value of a to result.
+=	Add and Assign // It adds the right operand to the left operand and then assigns the result to the left operand.	a += b; // This statement will add a and b and then assigns the result to a => a = a + b
-=	Subtract and Assign // It subtracts the right operand from the left operand and then assigns the result to the left operand.	a -= b; // This statement will subtract a and b and then assigns the result to a => a = a – b
*=	Multiply and Assign // It multiplies the right operand to the left operand and then assigns the result to the left operand.	a *= b; // This statement will multiply a and b and then assigns the result to a => a = a * b
/=	Divide and Assign // It divides the left operand by the right operand and then assigns the result to the left operand.	a /= b; // This statement will divide a by b and then assigns the result to a => a = a / b
%=	Modules and Assign // It takes modulus of left and right operand and assigns the result to left operand.	a %= b; // This statement will divide a by b and then assigns the remainder to a => a = a % b

Below is an example demonstrating the usage of Comparison Operators:

var num1 = 100, num2 = 30, num3 = 20, num4 = 200, num5 = 30;
var result;

result = num2 + num3; // result = 30 + 20 ==> result = 50
num2 += num3; // num2 = num2 + num3 ==> num2 = 30 + 20 ==> num2 = 50
num2 -= num3; // num2 = num2 – num3 ==> num2 = 50 – 20 ==> num2 = 30 (num2 is 50 from the previous step)
num2 *= num3; // num2 = num2 * num3 ==> num2 = 30 * 20 ==> num2 = 600
num1 /= num3; // num1 = num1 / num3 ==> num1 = 100 / 20 ==> num3 = 5
num4 %= num5; // num4 = num4 % num5 ==> num4 = 200 % 30 ==> num4 = 20

Ternary Operator

This operator is a short form of if…else.
Syntax: condition ? expr1 : expr2
If the condition is true, then expr1 will be evaluated, otherwise expr2 will be evaluated. You can also assign the value of this operator in any variable. Below example will display alert box with text 2018 is NOT a leap year!
var num = 2018;
(num % 4) == 0 ? alert(num + " is a leap year!") : alert(num + " is NOT a leap year!")