What are JavaScript Operators?
JavaScript operators are special symbols used in scripts to perform operations on operands, such as arithmetic calculations, logical comparisons, or value assignments. It plays a crucial role in controlling the flow and processing of data within the language.
Just like other programming languages, JavaScript offers various operators to perform distinct functions. JavaScript operators can be categorized into 5 types: Arithmetic, Assignment, Comparison, Logical and Conditional. Let’s know about each of them with the help of examples.
Explore: Online JavaScript Courses and Certifications
Table of Content
- What is an Operator?
- What are JavaScript Operators?
What is an Operator?
JavaScript operators are symbols that are used to execute operations on operands. Operands are the variables they operate on.
For example:
If we add 3 and 7, we get 10 as a result.
3+7=10
In this case, 3 and 7 are operands, whereas + is an operator.
Best-suited JavaScript courses for you
Learn JavaScript with these high-rated online courses
What are JavaScript Operators?
In JavaScript, we have various types of operators.
- Arithmetic Operators
- Assignment Operators
- Comparison (Relational) Operators
- Logical Operators
- Bitwise Operators
Arithmetic Operators
Arithmetic operators perform basic arithmetic operations on the operands. Below we have shown all arithmetic operators with their examples.
| Operator | Description | Example |
| + | Add | 7+3=10 |
| – | Subtract | 7-3=10 |
| * | Multiply | 7*3=21 |
| / | Divide | 7/3=2.34 |
| % | Modulus (Division Remainder) | 7%3=1 |
| ++ | Increment (Increase answer by 1) | var a=7; a ++; now a= 9 |
| – | Decrement (Decrease answer by 1) | var a=7; a – -; now a=5 |
The following code shows how to use arithmetic operators in JavaScript.
<html> <body> <script type="text/javascript"> <!-- var a = 7; var b = 3; var c = "Test"; var linebreak = "<br />"; [removed]("a + b = "); result = a + b; [removed](result); [removed](linebreak); [removed]("a - b = "); result = a - b; [removed](result); [removed](linebreak); [removed]("a / b = "); result = a / b; [removed](result); [removed](linebreak); [removed]("a % b = "); result = a % b; [removed](result); [removed](linebreak); a = ++a; [removed]("++a = "); result = ++a; [removed](result); [removed](linebreak); b = --b; [removed]("--b = "); result = --b; [removed](result); [removed](linebreak); //--> </script> Set the variables to different values and then try... </body></html>
Output:
a + b = 10 a - b = 4 a / b = 2.3333333333333335 a % b = 1 ++a = 9 --a = 5
Assignment Operators
The assignment operator assigns the value, variable, and function to another variable.
Here is the list of assignment operators.
| Operator | Description |
| = | Assign |
| += | Add and Assign |
| -= | Subtract and Assign |
| *= | Multiple and Assign |
| /= | Divide and Assign |
| %= | Modulus and Assign |
Example:
<html> <body> <script type="text/javascript"> <!-- var a = 7; var b = 3; var linebreak = "<br />"; [removed]("Value of a => (a = b) => "); result = (a = b); [removed](result); [removed](linebreak); [removed]("Value of a => (a += b) => "); result = (a += b); [removed](result); [removed](linebreak); [removed]("Value of a => (a -= b) => "); result = (a -= b); [removed](result); [removed](linebreak); [removed]("Value of a => (a *= b) => "); result = (a *= b); [removed](result); [removed](linebreak); [removed]("Value of a => (a /= b) => "); result = (a /= b); [removed](result); [removed](linebreak); [removed]("Value of a => (a %= b) => "); result = (a %= b); [removed](result); [removed](linebreak); //--> </script> </body></html>
Output
Value of a => (a = b) => 3 Value of a => (a += b) => 6 Value of a => (a -= b) => 3 Value of a => (a *= b) => 9 Value of a => (a /= b) => 3 Value of a => (a %= b) => 0
Comparison Operators
Comparison operators are used in logical statements to analyze equality or difference between variables or values.
| Operator | Description |
| == | Equal to |
| != | Not equal |
| > | Greater than |
| < | Less than |
| >= | Greater than or equal to |
| <= | Less than or equal to |
Example:
<html> <body> <script type = "text/javascript"> <!-- var a = 7; var b = 3; var linebreak = "<br />"; [removed]("(a == b) => "); result = (a == b); [removed](result); [removed](linebreak); [removed]("(a < b) => "); result = (a < b); [removed](result); [removed](linebreak); [removed]("(a > b) => "); result = (a > b); [removed](result); [removed](linebreak); [removed]("(a != b) => "); result = (a != b); [removed](result); [removed](linebreak); [removed]("(a >= b) => "); result = (a >= b); [removed](result); [removed](linebreak); [removed]("(a <= b) => "); result = (a <= b); [removed](result); [removed](linebreak); //--> </script> </body></html>
Output:
(a == b) => false (a < b) => false (a > b) => true (a != b) => true (a >= b) => true (a <= b) => false
Logical Operators
A logical operator determines whether a Boolean expression is true or false based on the operator used.
| Operator | Description |
| && | logical AND |
| || | logical OR |
| ! | logical Not |
<html> <body> <script type="text/javascript"> <!-- var a = true; var b = false; var linebreak = "<br />"; [removed]("(a && b) => "); result = (a && b); [removed](result); [removed](linebreak); [removed]("(a || b) => "); result = (a || b); [removed](result); [removed](linebreak); [removed]("!(a && b) => "); result = (!(a && b)); [removed](result); [removed](linebreak); //--> </script> </body></html>
Output:
(a && b) => false (a || b) => true !(a && b) => true
Bitwise Operators
The bit operators operate on 32-bit numbers. In operation, any numeric operand is converted into a 32-bit number. JavaScript converts the result back to a number.
| Operator | Description |
|---|---|
| & | Bitwise AND |
| | | Bitwise OR |
| ^ | Bitwise XOR |
| ~ | Bitwise NOT |
| << | Bitwise Left Shift |
| >> | Bitwise Right Shift |
Example:
<html> <body> <script type="text/javascript"> <!-- var a = 7; // Bit presentation 10 var b = 3; // Bit presentation 11 var linebreak = "<br />"; [removed]("(a & b) => "); result = (a & b); [removed](result); [removed](linebreak); [removed]("(a | b) => "); result = (a | b); [removed](result); [removed](linebreak); [removed]("(a ^ b) => "); result = (a ^ b); [removed](result); [removed](linebreak); [removed]("(~b) => "); result = (~b); [removed](result); [removed](linebreak); [removed]("(a << b) => "); result = (a << b); [removed](result); [removed](linebreak); [removed]("(a >> b) => "); result = (a >> b); [removed](result); [removed](linebreak); //--> </script> </body></html>
Output:
(a & b) => 3 (a | b) => 7 (a ^ b) => 4 (~b) => -4 (a << b) => 56 (a >> b) => 0
Also Read: Top JavaScript Interview Questions and Answers
Top FAQs on JavaScript Operators
What are JavaScript operators?
JavaScript operators are symbols used to perform operations on variables and values. They include arithmetic operators (like
+
-
==
>
&&
||
What is the difference between == and === in JavaScript?
The
==
===
How does the && operator work in JavaScript?
The && operator is a logical AND that returns true only if both operands are true. If the first operand is false, JavaScript doesn't evaluate the second operand and returns the first false value.
What is the purpose of the typeof operator?
The typeof operator returns a string indicating the type of the unevaluated operand. It's used to find the data type of a variable, like number, string, or object.
What does the "!" operator do in JavaScript?
The "!" operator is a logical NOT. It inverts the truthiness of the operand. If used twice, like !!, it converts a value to its boolean equivalent."
Chanchal is a creative and enthusiastic content creator who enjoys writing research-driven, audience-specific and engaging content. Her curiosity for learning and exploring makes her a suitable writer for a variety ... Read Full Bio
Top Picks & New Arrivals
