JavaScript operators perform some operation on one or more operands and produce a result. The operand is the data or value on which an operation is to be done. For Example, in the expression 10+2
, +
is an operator, while 10
& 2
are the operands.
Table of Contents
JavaScript Operators
The Operators perform an operation on operands. There can be one, two, or three operands. The operators that require only one operand are unary operators. Those who take two operands are binary operators. The JavaScript also have one ternary operator, which takes three operand
Binary Operators
A binary operator has one operand (Left operand) before the operator and one after the operator (right operand)
1 2 3 4 5 6 7 8 9 10 11 12 | //Syntax Leftoperand operator Rightoperand //Examples a+b 4-3 x*y |
Unary Operatos
The unary operator operates on a single operand. The operand can be either before or after the operator.
1 2 3 4 5 6 7 8 9 10 11 | //Syntax //Operand after the Operator operator operand //Examples x++ y-- |
The ternary operator
The JavaScript also has one special ternary conditional operator, which takes three operands.
List of JavaScript Operators
The JavaScript operators can be classified broadly based on their functions as follows.
- Arithmetic operators
- Logical operators
- Relational operators
- Bitwise operators
- Assignment operators
- Miscellaneous Operators
- Type Operator
Arithmetic operators
The arithmetic operators take numerical values as operands, operate on them, and return the result as a single numerical value.
Arithmetic Operator | Description & Examples |
---|---|
+ Addition operator | adds two numeric operands and produces the result. If the operands are string, then it performs string concatenation. Example: let a=10; let b=20 let sum = a+b; console.log(sum) //30; Example: string concatenation let a ="Hello" let b = "World" let c = a+ " "+b console.log(c) //"Hello World" |
- Subtraction operator | Subtracts the two operands, producing their difference. Example: let a=20; let b=10 console.log(a-b) //10; |
/ Division operator | The division operator numerator by the denominator. The left operand is the numerator and the right operand is the denominator. Example: let a=20; let b=10 console.log(a/b) //2; |
* Multiplication operator | The multiplication operator (*) produces the product of the operands. Example: let a=20; let b=10 console.log(a*b) //200; |
% Remainder operator | The remainder operator or modulus operator performs the division and returns the remainder Example let a = 27; let b = 5; console.log(a % b); // 2 |
** Exponentiation operator | The exponentiation operator (**) returns the result of raising the first operand to the power of the second operand. Example: let a = 2**5; console.log(a); //32 |
++ increment operator | This is the increment operator that increases the value by 1 Example: let a = 10; a++; console.log(a); //11 ++a; console.log(a); //12 |
-- decrement operator | This is the decrement operator that decreases the value by 1 Example: let a = 10; a--; console.log(a); //9 --a; console.log(a); //10 |
+ Unary Plus | The unary plus operator (+) precedes its operand and converts it into a number. Example let y = "1"; console.log(typeof(y)); //string console.log(typeof(+y)); //number console.log(+y); //1 |
- Unary Minus | The unary plus operator (-) precedes its operand and converts it into a number. Example let y = "1"; console.log(typeof(y)); //string console.log(typeof(+y)); //number console.log(-y); //-1 |
Logical operators
Operator | Description |
---|---|
&& Logical AND | Logical AND for a set of operands is true if and only if all of its operands are true. It returns the first falsy operand. If all the operands are true, then it returns the last operand. Example: let a=10 let b=15 console.log(a > 5 && b > 5) //true |
|| Logical OR | Logical OR for a set of operands is true if and only if one of the operands convert to true (truthy). It returns the first truthy operand Example: let a=10 let b=15 console.log(a > 5 || b > 5) //true |
! Logical NOT | The Logical NOT operator takes only one Operand and converts it to a boolean. Then it produces true, if the operand evaluates to false, and false if the operand evaluates to true Example: alert( !true ); // false |
Relational operators
Operator | Description |
---|---|
== Loose Equality Operator | It checks whether the values of the two operands are equal or not. If the operands are of different types, then it does a type conversion before comparing Example: let a = 10; let b = 10; let c = "10"; console.log(a==b); //true console.log(a==c); //true |
=== Strict Equality Operator | It checks whether the type and values of the two operands are equal or not. Example: let a = 10; let b = 10; let c = "10"; console.log(a===b); //true console.log(a===c); //false |
!= Not equal to | It checks whether the values of the two operands are equal or not. JavaScript does a type conversion if the types are not the same Example: let x=10 let y=10 console.log(x!=y) //false let a=10 let b="10" console.log(a!=b) //false |
!== Strict Not equal to | It checks whether the type and values of the two operands are equal or not. Example: let x=10 let y=10 console.log(x!==y) //false let a=10 let b="10" console.log(a!==b) //true becuase types are different |
> Greater than | It checks whether the value of the left operands is greater than the value of the right operand or not. Example let a = 5; let b = 2; console.log(a > b); //true console.log(a > 4); //true console.log(a > 5); //false console.log(a > 6); //false |
>= Greater than or equal | It checks whether the value of the left operands is greater than or equal to the value of the right operand or not. Example: let a = 5; let b = 2; console.log(a >= b); //true console.log(a >= 4); //true console.log(a >= 5); //true console.log(a >= 6); //false |
< Less than | It checks whether the value of the left operands is less than the value of the right operand or not. Example: let a = 5; let b = 2; console.log(a < b); //false console.log(a < 4); //false console.log(a < 5); //false console.log(a < 6); //true |
<= Less than or equal | It checks whether the value of the left operands is less than or equal to the value of the right operand or not. Example: let a = 5; let b = 2; console.log(a <= b); //false console.log(a <= 4); //false console.log(a <= 5); //true console.log(a <= 6); //true |
Bitwise operators
Operator | Description |
---|---|
& Bitwise AND | The Bitwise AND operator accept two operands. It compares each binary digit of the left operand with the digit at the corresponding position in the right operand. If both the bits are 1, then it returns 1, else returns 0. The following table shows how the digits are compared Example console.log(9 & 7) //1 00000000000000000000000000001001 =9 00000000000000000000000000000111 =7 ----------------------------------------------- 00000000000000000000000000000001 =1 ------------------------------------------------ |
| Bitwise OR | The Bitwise OR operator accepts two operands. It compares each binary digit of the left operand with the digit at the corresponding position in the right operand. If both the bits are 0, then it returns 0, else returns 1. The following table shows how the digits are compared Example console.log(9 | 7) //15 00000000000000000000000000001001 =9 00000000000000000000000000000111 =7 ------------------------------------------------- 00000000000000000000000000001111 =15 ------------------------------------------------- |
^ Bitwise XOR | The Bitwise XOR operator accepts two operands. It compares each binary digit of the left operand with the digit at the corresponding position in the right operand. If both the bits are different then it returns 1, else 0. The following table shows how the digits are compared console.log(9 ^ 7) //14 9 | 7 = 14 00000000000000000000000000001001 =9 00000000000000000000000000000111 =7 ------------------------------------------------- 00000000000000000000000000001110 =14 ------------------------------------------------- |
~ Bitwise NOT | Bitwise NOT ~ is a unary operator, hence takes only one operand. It just flips the binary digits from 1 to 0 & 0 to 1. Example ~5 = 6 00000000000000000000000000000101 = 5 11111111111111111111111111111010 = -6 |
>> Bitwise Right Shift | The Right Shift operator (>>) shifts the specified number of digits of the first operand to the right. The right operand specifies the number of digits to shift Example 9 00000000000000000000000000001001 = 9 9 >> 1 00000000000000000000000000000100 = 4 |
<< Bitwise Left Shift | The left Shift operator shift (<<) the specified number of digits of the first operand to the left. The right operand specifies the number of digits to shift Example 9 00000000000000000000000000001001 = 9 9 << 1 00000000000000000000000000010010 = 18 |
>>> Bitwise Right Shift with Zero | The Unsigned right Shift (also known as zero-fill right shift) operator (>>>) shift the specified number of digits of the first operand to the right. The right operand specifies the number of digits to shift Example 9 00000000000000000000000000001001 = 9 9 >> 1 00000000000000000000000000000100 = 4 |
Assignment operators
Name | Syntax | Meaning |
---|---|---|
Assignment | x = y | x = y |
Addition assignment | x += y | x =x+ y |
Subtraction assignment | x -= y | x = x - y |
Multiplication assignment | x *= y | x = x * y |
Division assignment | x /= y | x = x / y |
Remainder assignment | x %= y | x = x % y |
Exponentiation assignment | x **= y | x = x ** y |
Left shift assignment | x <<= y | x = x << y |
Right shift assignment | x >>= y | x = x >> y |
Unsigned right shift assignment | x >>>= y | x = x >>> y |
Bitwise AND assignment | x &= y | x = x & y |
Bitwise XOR assignment | x ^= y | x = x ^ y |
Bitwise OR assignment | x |= y | x = x | y |
Logical AND assignment | x &&= y | x && (x = y) |
Logical OR assignment | x ||= y | x || (x = y) |
Logical nullish assignment | x ??= y | x ?? (x = y) |
Miscellaneous Operators
Misc Operators | Description & Examples |
---|---|
+ String Concatenation | The string concatenation operator (+) concatenates two string values and returns a new string let a = "Hello "+ "World" console.log(a) //Hello World |
? Conditional (ternary) operator | Syntax condition ? expression1 : expression2; If the condition is true, the operator has the value of val1. Otherwise, it has the value of val2. You can use the conditional operator anywhere you would use a standard operator. Example let isValid = true; let message = isValid ? 'Valid' : 'Failed'; console.log(message) //'Valid |
, Comma operator | The comma operator separates each of its operands and evaluates all of them from left to right. It returns the value of the last operand. Example let x = 1; let y = 10; x = (x++, y++, x+y); console.log(x) //13 |
Type Operators
Type Operators | Description & Examples |
---|---|
in | The in operator returns true if the specified property is in the specified object. Example var mycar = { make: 'Honda', model: 'Accord', year: 1998 }; 'make' in mycar; // returns true 'model' in mycar; // returns true |
delete | The delete operator deletes an object's property. Examples var myobj = {h: 4}; // create object with property h delete myobj.h; // returns true (can delete user-defined properties) |
typeof | The typeof operator returns a string indicating the type of the unevaluated operand Example console.log(typeof 1337) // number console.log(typeof "foo") // string console.log(typeof true) // boolean console.log(typeof Math.round) // function console.log(typeof undefined) // undefined console.log(typeof null) // object |
instanceof | The instanceof operator returns true if the specified object is of the specified object type. Example class Person { name: string = ''; } let person = new Person(); console.log(person instanceof Person ); // true console.log(person instanceof Object ); // true |
Operator Precedence
The operator precedence along with their associativity determines how JavaScript evaluates an expression when there are multiple operators present in the expression. Each JavaScript operators have certain precedence. The JavaScript evaluates the operators with higher precedence first. If a group of operators has the same Precedence, then it evaluates them either left to right or right to left, depending on the operator’s associativity.
Click to read more about Operator Precedence
Reference
Read More
- JavaScript Tutorial
- JavaScript Operators
- Arithmetic Operators
- Unary plus (+) & Unary minus (-)
- Increment & Decrement Operators
- Comparison or Relational Operators
- Strict Equality & Loose Equality Checker
- Ternary Conditional Operator
- Logical Operators
- Bitwise Operators
- Assignment Operators
- Nullish Coalescing Operator
- Comma Operator
- Operator Precedence