Operators in JavaScript are used in different type of expressions like arithmetic( 1 + 2 ). Most of JavaScript operators are just punctuation marks, however there are a few which are keywords(delete and instanceof). Below is a table listing all of operators in JavaScript in order of their presedence moving from higher to lower.
| Operator | Operation Done by it |
|---|---|
| ++ | Pre or post increment |
| — | Pre or post decrement |
| ~ | Invert bits |
| ! | Invert boolean value |
| delete | Remove property |
| typeof | Determine type of operand |
| void | Return undefined value |
| *, /, % | Mutiply, divide, remainder |
| +, – | Add, Subtract |
| << | Shift Left |
| >> | Shift right with sign extension |
| >>> | Shift right with zero extension |
| >, <=, >, >= | Comparing numbers or strings(Alphabetic Order) |
| instanceof | Test object’s class |
| in | Testing whether an object have a property or not |
| == | Testing for equality |
| != | Inequality testing |
| === | Test for strict equality |
| !== | Testing for strict inequality |
| & | Computer Bitwise AND |
| ^ | Compute Bitwise OR |
| | | Computer bitwise OR |
| && | Compute logical AND |
| || | Computer logical OR |
| ?: | Choose 2nd or 3rd operator |
| = | Assign to a variable or property |
| *=, /=, %=, += | Operate and assign |
| -=, &=, ^=, | = | Operate and assign |
| <<=, >>=, >>>= | Operate and assign |
| , | Discard 1st operand, return second |
Table of Contents
Types of Operators in JavaScript
Briefly JavaScript operators can be divided into two parts – Unary and Binary. While unary operators just need one operand, binary require two operands. Instead it could also be said that JavaScript operators are of 12 types depending upon which expression they’re used in –
Arithmetic Operators
Arithmetic operators in JavaScript are used for performing arithmetic operations on variables/values. Below is a table listing all of Arithmetic Operators –
| Arithmetic Operator | What it do | Examples |
|---|---|---|
| + | Addition of numbers | 2 + 3 (5) |
| – | Subtraction of numbers | 10 – 3 (7) |
| * | Multiplication of numbers | 54 * 3 (162) |
| / | Division of numbers | 84/4 (21) |
| % | Modulus(Remainder left after division of two numbers) | 11%3 (2) |
| ++ | Incrementing number | ++10 (11) |
| — | Decrementing number | –84 (83) |
Assignment Operators
As is clear from name Assignment Operators itself, it’s about assigning a value to something, which in case of JavaScript is variable. Below is a table listing all of Assignment Operators in JavaScript –
| Assignment Operator | What it do | Examples | Explanation |
|---|---|---|---|
| = | Assign value of one of it’s operand to another | a = b | If a = 10 then b will also become 10 |
| += | Adding two values first then assigning | a += b (a = a + b) | If a = 1, b = 3 then after execution of this expression a will become 4 |
| -= | Subtracting two values first then assigning | a -= b (a = a – b) | If a = 10, b = 8 then after execution of this expression a will become 2 |
| *= | Multiply two numbers then assign | a *= b (a = a * b) | If a = 30, b = 4 then a will become 120 |
| /= | Divide two numbers then assign | a /= b (a = a / b) | If a = 100, b = 5 then a will become 20 |
| %= | Take remainder of two numbers then assign | a %= b (a = a % b) | If a = 35, b = 3, then a will become 2 |
String Operators
String Operators in JavaScript are used for concatenating two strings together. Below is a table listing JavaScript String Operators –
| String Operators | What it do | Examples | Explanation |
|---|---|---|---|
| + | Stick together number of strings and make one | “Computer” + ” Science” + ” Hub” | Computer Science Hub Just squeezing together strings |
| += | Stick together number of strings and make one | text_a += text_b (text_a = text_a + text_b) | “Computer” += ” Science” Will become Computer Science |
Comparison Operators
Comparison Operators in JavaScript are used inside Logical Expressions mainly for testing equality of identities. In case you want to know more about Logical Expressions in JavaScript, see this article – JavaScript Logical Expressoins. Below is a table listing all of JavaScript Comparison Operators –
| Comparison Operator | What it do | Examples | Explanation |
|---|---|---|---|
| == | Check for equality of value of identities(variables, objects, functions in JavaScript) | 10 == 8 | Returns false |
| === | Check for equality of value as well as type | If x is 5 x === “5” (false) | Returns false as x is numeric number while “5” is a string in JavaScript |
| != | Not equal | If x is 5 x != 7 | Returns true as x is actually 5 |
| !== | Checking either type is not same or value is not same | x !=== “10” (true) x !=== 10 (false) | |
| > | Greater than | x > 10 | |
| < | Less than | x < 18 | |
| >= | Greater than or equal to | x >= 19 | |
| <= | Less than or equal to | x <= 74 |
Conditional Operator
A Conditional Operator in JavaScript assigns value to a variable based upon some condition. For JavaScript Programming Language conditional operator is ?: syntax is (condition) ? value_one : value_two
| Conditional Operator | What it do | Examples |
|---|---|---|
| variable_name = (condition) ? value1 : value2 | Check for condition then based upon it select a single value out of two | voteable = (oil > 10) ? “Will Reach New York” : “Not reach New York” |
Logical Operator
Logical Operator in JavaScript are used for checking logic between two entities (either JavaScript Object or Function).
| Logical Operator | What it do | Examples |
|---|---|---|
| && (AND) | Will do logical AND operation and would return a Boolean | (x > 8 && x < 10) |
| || (OR) | Do logical OR operation and will return a Boolean | (x < 10 || x > 20) |
| ! (NOT) | Logical NOT operation, just reserves true to false or false to true | ! (x > 10) (Read as => x is not greater than 10) |
typeof Operator
The operator typeof return JavaScript Type of a variable, object, function. Most often these returned type would be primitive data type(string, number, boolean).
| typeof Operator |
|---|
| typeof(“Computer Science Hub”) // Returns string |
| typeof(10.23) // Returns number |
| typeof NaN // Returns number |
| typeof false // Returns Boolean |
| typeof new Date() // Returns Object |
| typeof {website: “computersciencehub.io”, age: “1 year”} // Returns Object |
delete Operator
JavaScript delete Operator just deletes a property from an object. If your not aware of “What a JavaScript Object?” then please see this – What are Objects in JavaScript?
| delete Operator |
|---|
| var car = { name : “Tesla”, model : “2020 Model S”, color : “red”}; |
| delete car.color; (Deleting color property of car object) |
| { name : “Tesla”, model : “2020 Model S” } (Object after delete car.color) |
in Operator
JavaScript in operator returns true if specificed property is in the specified object itself other wise it would return false.
- in Javascript Operator for Arrays
For arrays JavaScript checks whether there’s value at that index or not.
| in Javascript Operator for Arrays |
|---|
| var coding = [“JavaScript”, “Python”, “SQL”] //JavaScript Array |
| 0 in coding // returns true |
| 1 in coding // returns true |
| 2 in coding // returns true |
| 3 in coding // returns false |
- in JavaScript Operator for Objects
For objects JavaScript in operator looks for specific property name.
| in JavaScript Operator for Objects |
|---|
| var cars = {car_one : “Tesla”, car_two : “Cybertruck”}; |
| “car_one” in cars // returns true |
| “car_two” in cars // returns true |
| “car_three” in cars // returns false |
instanceof Operator
JavaScript instanceof Operator checks for whether object is an instance of a specific class.
| JavaScript instanceof Operator |
|---|
| var websites = [“Google”, “Facebook”, “Bing”]; |
| websites instanceof Array; // returns true |
| websites instanceof Object; // returns true |
| websites instanceof String; // returns false |
| websites instanceof Number; // returns false |
void Operator
JavaScript void operator evaluates an expression and returns undefined.
Operator Precedence JavaScript
For various operators in JavaScript while doing different computations, then you need to take care of priority of different operators. Operators with higher priority should be calculated first and then that with less priority is computed.
Moreover if content on this image is not appearing clear to you, then don’t worry I’ve put together a pdf as well – Listing all of JavaScript’s Operators Precedence. Download that pdf by clicking button below –
Let’s understance this with an example –
w = x + y*z for this JavaScript Expression as * (multiplication) have higher precedence over + (addition). That’s why JavaScript Engine will compute y*z first and then would add result to x.
Conclusion
Operators are fundamental building block of JavaScript Programming Language, remembering symbols of operator and what they do is easy part. What I personally have seen that most of people struggle with precedence order which JavaScript uses internally. Specifically if your doing a lot of computations in code, then just ignoring Operators Precedence/Priority may broke whole program and you would end up with something which you never expected.
But don’t worry I’ve put together Operator’s precedence table for you, if you got stuck somewhere or just forgets something then you can refer to this article on Computer Science Hub or can also download precedence table by clicking “Download” button little above on this page, save it in your PC for referencing.
I hope that you find this article useful, moreover if your learning JavaScript Programming Language. Then for you I’ve put together some awesome articles, on this website, as a learning resource, you can see those here – JavaScript Computer Science Hub.
