Javascript operator is symbol which performs some sort of mathematical, logical or assignment operations. In some cases operator helps in shorten the code(we will see it in this chapter).
Lets see a simple example based on operator
2 + 2 (here + is the addition operator and 2,2 are operands) the + operator will do the addition operation on two numbers.
Javascript uses several different types of operators
1.Arithematic operators
2.Assignment operators
3.Comparison operators
4.Logical operators
5.Bitwise operators
6.Special operators
Understanding Mathematical Operators
These operators are used to do mathematical operations such as addition, subtraction, multitplication, division etc.
let’s quickly see a js code
1
2
3
4
5
6

<script>
var x = 23; //learn more about variables in the 2nd chapter of the series
var y = 12;
var z = x + y; //storing the sum of x and y in var z
document.write(z); //alerting var z
</script>

In the above code we declare three variables and in variable x and y we store two numbers and store the addition of the two numbers in variable z using the ‘+’ operator.
Lets see another code
1
2
3
4
5
6

<script>
var x = “Hello”; //learn more about variables in the 2nd chapter of the series
var y = “world”;
var z = x + y; //storing the sum of x and y in var z
document.write(z);
</script>

The above code will produce the output as Helloworld, which means the ‘+’ operator can also be used to concatenate two strings, now you must be thinking what will be the output if we add a number and string ? the answer is the ouput will be a string, javascript will concatenate the number and the string for example see the below code
1
2
3
4
5
6

<script>
var x = 2; //learn more about variables in the 2nd chapter of the series
var y = “world”;
var z = x + y; //storing the sum of x and y in var z
document.write(z);
</script>

The above code will produce the output as 2world, did you see how javascript convert one type of data into another in this case it converts number into a string, this is known as type conversion.
Now let’s try some other arithematic operators,
1
2
3
4
5
6
7
8
9

<script>
var x = 6; //learn more about variables in the 2nd chapter of the series
var y = 5;
var sum = x + y; //storing the sum of x and y in var z
var difference = x – y;
var product = x * y;
var dividend = x / y //the ‘/’ opertor returns the dividend
document.write(sum + ” “ + difference + ” “ + product + ” “ + dividend);
</script>

The above code will produce the output as : 11 1 30 1.2, in the document.write() we concatenate each variable with a <space> thats why we got space between each output.
Try Yourself : Modify the above code and directly use the + operator without any space strings in document .write function and examine the output hint: document.write(sum + difference + product + dividend);
uptil now we have discussed some of the basic arithematic operators, now let’s see some more arithematic operators.
Modulus Operator (%)
This operator returns the remainder of two numbers for example
3 % 2 will return 1 as 1 is the remainder when we divide 3 / 2.
1
2
3
4
5

<script>
var a = 3; //assigning variable a equals to 3
var b = 4; //assigning variable b equals to 4
document.write(b%a);
</script>

The above code will print the output as 1.
The increment operator(++)
The increment operator can be used on either side of the value on which it is going to be operated. It increases the value by 1 just like adding 1 to the value. The actual result depends on whether the operator is used before or after the value it works on. This operator often used with variables and within loops(we will study loops in the upcoming chapters of the series).
1
2
3
4

var x = 10;
document.write(x); //10
x++; //x++ is same as x = x+ 1
document.write(x); //11

1
2
3
4
5

var x = 10;
document.write(x); //output 10
var y = x++;
document.write(y); //output 10
document.write(x); //output 11

Now you must be thinking that the value stored in y should be 11, but it is not x++ means first use the value and then increment it by 1 thats why ++ comes after the operand.
1
2
3
4
5

var x = 10;
document.write(x); //output 10
var y = ++x;
document.write(y); //output 11
document.write(x); //output 11

The Decrement Operator (–)
It is exactly opposite of (++) operator , in place of increment the value by 1 it decrements the value by 1 and is used either of the side of the operand.
Try yourself: Write the above (++) codes for the decrement operator
The Unary Negation() Operator
This operator is used to create negative numbers it is used before an operand. For example
1
2
3

var x = 3;
var y = –3;
document.write(x–y); //output 6

we have already studied the (=) operator in chapter2, it is used to assign a value to a variable. For example
1

var x = 3.14; //here = is assigning x the value 3.14

Assignment(=)
Add and assign(+=)
Subtract and assign(=)
Multiply and assign(*=)
Divide and assign(/=)
Modulus and assign(%=)
Lets see how these operators work
Add and Assign operator
Let’s see a simple expression
1

var x += 5;

1

var x = x + 5

Now it may look familiar to you ,actually both (x = x+ 5) and (x += 5) are same, the (+=) operator adds the value on the right side to the variable on the left side and then assign the new value to the variable.
All the other assignment opertors work in the same manner as add and assign operator so..
Try yourself: Implement all the remaining assignment operators using JavaScript
Understanding the Comparison Operators
The comparison operators are mostly used when we have to make a judgement by comparing two or more values, some comparison operators are (> , < , ==, !=, >=, <=, === , !==) maybe you have seen most of them in your maths notebook and actually the meant the same in Javascript too. Comparison operator returns boolean value either true or false. Lets take a simple example
1
2
3
4

var x = 20;
var y = 10;
var z = x > y;
document.write(z); //output will be true

The above code will print output as true, for getting false just change the expression as (x < y).
Lets try to implement some comparison operators in our JavaScript code
1
2
3
4
5
6

var x = 20;
var y = 20;
document.write(x > y); //false
document.write(x < y); //false
document.write(x >= y); //greater then or equals to, true
document.write(x <= y); //smaller then or equals to, true

we still have some few comparison operators left such as (==,===,!= and !==)
lets see what they means,
is Equal to operator(==)
This operator is used to check whether two values are equal or not, it neglects the datatype of the variable for example
1
2
3
4
5

2 == 2 //true
2 == “2” //true, neglacting the datatype
2 == 3 //false

Notice: Be careful not to use (=) operator in place of (==) operator as (=) operator is used for assigning purpose.
Strict is Equal to Operator (===)
The (===) operator also checks for quality but the difference is that it does not neglect the datatype for example
1

2 === “2” //this will return false

This is the main difference between (==) and (===) operator.
Not equal to (!=) and Strict Not Equal to Operator (!==)
These operators are totally opposite of (==) and (===) operator, both these operator checks for inequality of two values for example
1
2
3

var x = 10;
var y = “20”;
document.write(x!=y); //output true

The Strict not Equal to operator checks for inequality and do not neglect the datatype.
Understanding Logical Operators
The three logical operators allow you to compare two conditional statements to see if one or both of the statements is true and to proceed accordingly. The logical operators can be useful if you want to check on more than one condition at a time and use the results. Like the comparison operators logical operators also return either true or false, depending on the values on either side of the operator.
The AND(&&) Operator
The logical AND operator returns true if and only if both sides of the && operator are true. If one or both comparisons on either side of the operator is false, a value of false is returned, some expressions
1
2
3

(23 > 20) && (10 == 10) //return true as both sides are true
(20 > 10) && (10 == 10) //return false as left hand side is false

The OR(  ) Operator
The logical OR operator returns true if either of the side of expression is true, if both the sides are false then only it will retrun false. Examples:
1
2
3

(20 > 10)  (10 == 10) //return true as right hand side is true
(10 != 10)  (10>18) //retrun false as both the sides are false

The NOT(!) Operator
This operator basically converts an expression which is returning true to false and vice versa, for example:
1
2
3

!(10 == 10) //return false as it converts true to false
!(20 > 18) //return true as it converts false to true

Bitwise Operators
Bitwise operators are operators which deals with bits(1’s and 0’s), we will cover these type of operators later in the series.
That’s it for now, if you have any queries then feel free to comment down below
Suggest
React VR – Creating Virtual Reality Apps
The Full JavaScript & ES6 Tutorial – (including ES7 & React)