An operator is a character or a set of characters that perform a specific task. JavaScript operators help programmers do mathematical and logical calculations inside their program.
Some examples of JavaScript Operators are: +, –, =, &&, ||, +=, -=, etc.
In JavaScript, operators are categorized into certain types. They are as follows:
- Assignment Operators 🛢
- Arithmetic Operators ➕➖
- Comparison Operators 🆚
- Logical Operators 🤔
- Bitwise Operators 🔟
- String Operators 🔤
- Conditional Operator ⁉
- Comma Operator ⏭
- Others 📁
Note: Also check out our JavaScript 👉 JavaScript Data Types lesson.
JavaScript Assignment Operators 🛢
The assignment operator in JavaScript assigns value of its right operand to its left operand. Operand is the data that is being operated on.
var number = 8; //Assign the value 8 to 'number'
console.log(number);
Here, = is an assignment operator and ‘number‘ & 8 are its operands. The right operand i.e. 8, is being assigned to the left operand i.e. number.
Output
8
Some most commonly used Assignment Operators in JavaScript are as follows:
| Operator Name | Operator Symbol | Example | Meaning |
| Assignment | = | a = b | Assign the value of b to a. |
| Addition Assignment | += | a += b | a = a + b |
| Subtraction Assignment | -= | a -= b | a = a – b |
| Multiplication Assignment | *= | a *= b | a = a * b |
| Division Assignment | /= | a /= b | a = a / b |
| Remainder Assignment | %= | a %= b | a = a % b |
Example of some Assignment Operators
var a = 10;
var b = a; // Assigning the value of a into b
console.log(b);
var x = 1, y = 2;
x += y; // Means x = x + y. Thus, x gets assigned the value of x = 1 + 2 i.e. 3
console.log(x);
var c = 4, d = 5;
c *= d; // Means c = c * d. Thus, c gets assigned the value of c = 4 * 5 i.e. 20
console.log(c);
var r = 3, s = 2;
r %= s; // Means r = r % s.
//Thus, r gets assigned the value of r = 3 % 2 i.e. 1
//The % operator calculates remainder. When 3 is divided by 2, the remainder is 1. So, r gets assigned the value 1.
console.log(r);
Output
10
3
20
1
JavaScript Arithmetic Operators ➕➖
The arithmetic operator in JavaScript allows us to perform arithmetic calculations like addition, subtraction, multiplication and division.
Some of the most commonly used Arithmetic Operators in are as follows:
| Operator Name | Operator Symbol | Example |
| Addition | + | a + b |
| Subtraction | – | a – b |
| Multiplication | * | a * b |
| Division | / | a / b |
| Remainder | % | a % b |
| Increment | ++ | a++ and ++a |
| Decrement | — | a– and –a |
Example of some Arithmetic Operators
var a = 10, b = 5, sum;
sum = a + b;
console.log(sum);//Output is 15
var x = 4, y = 3, product;
product = x * y; // Output is 12
console.log(product);
var c = 7, d = 3, rem;
var rem = c % d; // Output is 1. As 7 divided by 3 gives remainder 1.
console.log(rem);
var i = 9, inc1;
//If i is 9, then ++i sets i to 10 and returns 10.
inc1 = ++i; //Output is 10. The ++i means, first increase the value of i by 1 and return the increased value.
console.log(inc1);
var j = 9, inc2;
//If j is 9, then j++ returns 9 and, only then, sets j to 10.
inc2 = j++; //Output is 9. The j++ means, first return the old value and only then, increase the value of j by 1.
console.log(inc2);
Output
15
12
1
10
9
JavaScript Comparison Operators 🆚
The comparison operators in JavaScript are used for logical calculations. It helps us compare between operands and return either true or false based on the comparison.
Some of the most commonly used Comparison Operators in JavaScript are as follows:
Let’s use two variables var a = 2 and var b = 3 to explain comparison operators clearly.
| Operator Name & Symbol | Description | Example | Output |
| Equal to (==) | Returns true if the operands are equal | a == 2 a == 3 a == b | true false false |
| Not Equal (!=) | Returns true if the operands are not equal | a != 3 a != 2 a != b | true false true |
| Strictly Equal (===) | Returns true if the operands have same value and same data type | a===2 a===”2″ | true false |
| Strictly Not Equal (!==) | Returns true if the operands have same value but not the same data type | a!==”2″ a!==2 | true false |
| Greater than (>) | Returns true if left operand has larger value than the right operand | a > 1 a > 5 a > b | true false false |
| Less than (<) | Returns true if left operand has smaller value than the right operand | a < 5 a < 1 a < b | true false true |
| Greater than or equal (>=) | Returns true if left operand either has larger value than the right operand or is equal to the right operand | a >= 2 a >= 1 a >= b | true true false |
| Less than or equal (<=) | Returns true if left operand either has smaller value than the right operand or is equal to the right operand | a <= 2 a <= b a <=1 | true true false |
Examples of some Comparison Operators
var a = 2, b = 3;
console.log(a == 2); //Output is true
console.log(b === "3"); //Output is false. As "3" belongs to a String Data Type but b has the value 3 which is a Number Data Type. So, it returned false as operands do not have same value and same data type
console.log(a != b); //Output is true
console.log(b !== "3"); //Output is true. As "3" belongs to a String Data Type but b has the value 3 which is a Number Data Type. So, it returned true as operands have the same value but not the same data type
console.log(a > 10); //Output is false
console.log(b >= a); //Output is true
Output
true
false
true
true
false
true
JavaScript Logical Operators 🤔
The logical operators in JavaScript describe and find out the logic between the operands. The available Logical Operators in JavaScript are as follows:
Let’s use two variables var a = 2 and var b = 3 to explain logical operators clearly.
| Operator Name & Symbol | Description | Example | Output |
| Logical AND (&&) | Returns true if and only if both operands (or operations) are true, otherwise returns false | (a>1 && b<4) (a>1 && b>10) (a>10 && b>1) | true false false |
| Logical OR (||) | Returns true if either one of the operands (or operations) are true, otherwise returns false | (a>1 || b>4) (a<1 || b>2) (a<1 || b>10) | true true false |
| Logical NOT (!) | Returns true if the operand (or operation) is false and returns false if the operand (or operation) is true | !(a==2) !(a>10) | false true |
Examples of some Logical Operators
var a = 2, b = 3;
console.log(a > 1 && b < 4); //Output is true as both operations a > 1 AND b < 4 are true.
console.log(a > 1 && b > 10); //Output is false as a > 1 is true BUT b > 10 is false.
console.log(a > 1 || b > 4); //Output is true as either one of the operations is true. Here, a > 1 is true. So, the result also becomes true EVEN IF b > 4 is false.
console.log(a < 1 || b > 10); //Output is false as both operations are false. Here, a < 1 is false and b > 10 is also false.
console.log(!(a == 2)); //Output is false as a == 2 is true but when we use the ! operator, true becomes false. So, our result is false.
console.log(!(a > 10)); //Output is true as a > 10 is false but when we use the ! operator, false becomes true. So, our result is true.
Output
true
false
true
false
false
true
JavaScript Bitwise Operators 🔟
The bitwise operators in JavaScript operate on bits rather than entire numbers or text. Each character in a computer is represented as a series of binary bits. The bitwise operator treats its operands as a series of 32 binary bits. For example: The number 5 is represented as 0101 in binary bits and a bitwise operator operates on the binary bits 0101 rather than the decimal number 5.
The most commonly used Bitwise Operators in JavaScript are as follows:
| Operator Name & Symbol | Description | Example | Output |
| Bitwise AND (&) | Returns 1 in each position if corresponding bit of both operands is 1, otherwise returns 0 | 4 & 5 (in binary: 0100 & 0101) | 0100 |
| Bitwise OR ( | ) | Returns 1 in each position if either one of the corresponding bits of the operands is 1, otherwise returns 0 | 4 | 5 (in binary: 0100 | 0101) | 0101 |
| Bitwise XOR (^) | Returns 1 in each position if and only if one of the corresponding bits of the operands is 1, otherwise returns 0 | 4 ^ 5 (in binary: 0100 | 0101) | 0001 |
| Bitwise NOT (~) | Returns 1 in each position if corresponding bit of operand is 0 and returns 0 if corresponding bit of operand is 1. In other words, it inverts bits. | ~6 (in binary: ~0110) | 1001 |
Examples of some Bitwise Operators
var a = 4, b = 5;
console.log(a & b); //Output is 4. As, in binary, (4 & 5) means (0100 & 0101). The result becomes 0100 i.e. 4
console.log(a | b); //Output is 5. As, in binary, (4 | 5) means (0100 | 0101). The result becomes 0101 i.e. 5
console.log(a ^ b); //Output is 1. As, in binary, (4 ^ 5) means (0100 ^ 0101). The result becomes 0001 i.e. 1
Output
4
5
1
JavaScript String Operators 🔤
The string operators in JavaScript can add two or more strings and return the whole added string. The Addition Operator + that we described above is used to add strings.
Example
console.log("Hello, I am learning "+"JavaScript"); //Output: Hello, I am learning JavaScript
//Using variables
var firstname = "Isaac", lastname = "Newton";
var fullname = firstname +" "+ lastname;
console.log(fullname); //Output: Isaac Newton
Output
Hello, I am learning JavaScript
Isaac Newton
Apart from the addition operator +, the Addition Assignment Operator += is also used to concatenate (or add) strings.
Example
var message = "I am learning ";
message += "JavaScript";
console.log(message); //Output: I am learning JavaScript
Output
I am learning JavaScript
JavaScript Conditional Operator ⁉
The conditional operator in JavaScript lets us evaluate two values based on a condition. It is the only JavaScript operator that takes three operands. It is denoted by ?: .
Syntax
condition ? value1 : value2;
The above syntax means that if condition is true, then value1 is returned and if it is false, value2 is returned.
Example
var status, age = 19;
//If age is greater than or equal to 18, then the conditional operator (?:) returns "Can Vote" otherwise returns "Cannot Vote"
status = (age >= 18) ? "Can Vote" : "Cannot Vote";
console.log(status); //Output: Can Vote
Output
Can Vote
JavaScript Comma Operator ⏭
The comma operator in JavaScript lets us evaluate each of its operands and returns the value of its last operand. It is denoted by ,. It is mostly used in for loops. Don’t worry, we will learn about loops in our JavaScript Loops lesson.
Syntax
operand1, operand2, operand3 and so on
Example
var result;
result = (1, 2, 3);
console.log(result); //Output is 3. As the comma operator returns the value of the last operand which is 3 in this example.
Output
3
Other operators in JavaScript 📂
There are other remaining operators in JavaScript. They are: delete, typeof, void, in and instanceof. However, we are not going to explain all of them as they can create confusion in this beginner friendly course.
We already explained the typeof operator at the end of our JavaScript Data Types lesson. You can go ahead and check it out.
In this way, operators in JavaScript help us in performing mathematical and logical calculations throughout our program.