What are operators in Javascript – Learn Javascript Online!

I am really glad to get the best response from you guys that you are supporting me and my website for the Javascript work. I am very happy with you response really.

Thanks for this much of excitement. Keep it on the same track to motivate me to provide quality work.

Today’s topic is operators in Javascript…

Are you familiar with it? If you are saying yes then you are also welcome for the session but if you are saying NO then you are most welcome. I am here to help you and provide a quality information.

So without wasting time, let’s get started with it…

Operators, as the name is saying that anything that is operating something, right? But how you will define it programmatically?

Operators are very the symbols or expression that performs the operation on operands. Got it? Still saying no? No problem, let me get more deep into it, so that you can get a clear overview.

e.g. 3 + 4 = 7

Here in the above example, 3 and 4 are operands, and an operation is performed on them. Can you tell me that, please? Yes, you are right ‘+’.

So, what we have the overall conclusion? 

It’s very simple dear, ‘+’ is the operation and 3 and 4 are the operands, on which it’s going on or performed…

So, here the question float in our mind that how many operations, we can perform?

Let me tell you different types of Javascript operators.

  1. Arithmetic Operators
  2. Comparison Operators
  3. Logical (or Relational) Operators
  4. Assignment Operators
  5. Conditional (or ternary) Operators

Okay, let’s start with the description of all the above-listed operators.

Arithmetic Operators

What is an Arithmetic operator? This question strikes our mind firstly if we don’t know…

But let me tell you something about it. Arithmetic is related to all the mathematical operations. I have listed them below:

  1. (+) Addition
  2. (-) Subtraction
  3. (*) Multiplication
  4. (%) Modulus
  5. (/) Division
  6. (++) Increment
  7. (–) Decrement

Arithmetic Operators in Javascrript

Arithmetic Operators in Javascript

<html>
 <body>
 <script type="text/javascript">
 
 var a = 2; // variable declared to set the value of variable a,
 var b = 4; // variable declared to set the value of variable b,
 var c = "Nine"; // variable declared to set the string value of variable c,
 var linebreak = "<br />"; // adding a line break.
 
 document.write("a + b = ");
 result = a + b;
 document.write(result);
 document.write(linebreak);
 
 document.write("a - b = ");
 result = a - b;
 document.write(result);
 document.write(linebreak);
 
 document.write("a / b = ");
 result = a / b;
 document.write(result);
 document.write(linebreak);
 
 document.write("a % b = ");
 result = a % b;
 document.write(result);
 document.write(linebreak);
 
 document.write("a + b + c = ");
 result = a + b + c;
 document.write(result);
 document.write(linebreak);
 
 a = ++a;
 document.write("++a = ");
 result = ++a;
 document.write(result);
 document.write(linebreak);
 
 b = --b;
 document.write("--b = ");
 result = --b;
 document.write(result);
 document.write(linebreak);
 </script>
 
 </body>
</html>

Comparison Operators

Comparison operators are used to comparing two different values. It compares two values and let you that which one is greater, smaller and equal etc.

Are you wondering an example? Sure I will tell you just go ahead…

e.g. a < b  (a = 2, b = 5) answer will be true. Because a value is actually less than b.

I am listing the comparison operators here:

  1. (==) Equal To
  2. (!=) Not Equal
  3. (<) Less than
  4. (>) Grater Than
  5. (<=) Less than or Equal to
  6. (>=) Greater than or Equal to
Comparison Operators in Javascrript

Comparison Operators in Javascript

<html>
 <body>
 
 <script type="text/javascript">
 <!--
 var a = 10;
 var b = 20;
 
 
 document.write("(a == b) => ");
 comp_result = (a == b);
 document.write(comp_result);
 document.write("<br />");
 
 document.write("(a < b) => ");
 comp_result = (a < b);
 document.write(comp_result);
 document.write("<br />");
 
 document.write("(a > b) => ");
 comp_result = (a > b);
 document.write(comp_result);
 document.write("<br />");
 
 document.write("(a != b) => ");
 comp_result = (a != b);
 document.write(comp_result);
 document.write("<br />");
 
 document.write("(a >= b) => ");
 comp_result = (a >= b);
 document.write(comp_result);
 document.write("<br />");
 
 document.write("(a <= b) => ");
 comp_result = (a <= b);
 document.write(comp_result);
 document.write("<br />");
 //-->
 </script>
 
 </body>
</html>

Logical Operators

  1. && (Logical AND)
  2. || (Logical OR)
  3. ! (Logical NOT)

Let me explain you these operators, it’s quite complicated to explain but I will try my best.

&& – Logical AND

Logical AND is an operator which checks the condition like both comparing operands should falls true or all the operands should be true then the Logical AND will result out true. or If both the operands are non-zero, then the condition becomes true. Hard to get?

Let me give you an example.

a = 4

b = 8

(a <= b && a > 2) here in the condition both comparing should be true then AND results in the true. What are the conditions saying let’s get into more depth…

first of all, we have a <= b, It’s clearly saying that a should be smaller than b but it can also be equal to b because = is used within the same condition. If this condition falls true then its ok to give +ve results. so let check here what it will lead.

We have a = 4 and b = 8, where we can clearly se that condition is falling true, because a is smaller than b. So it will obviously lead to the +ve result i.e this statement is true.

After that, we have a>2, it means a should be greater or larger than the value of b then the condition will fall true otherwise it will lead to false result. Here the condition is false because value of a is less than b. So it will lead to the condition faliure.

Here in the example, first condition is true but second is not. So ultimate result will be false. If both conditions result true only then the whole condition will be true.

Logical Operator in Javascript Example - Learn Javascript Online with Rahul Rahi

Logical Operator in Javascript Example

<html>
 <body>
 <script type="text/javascript">
    var a = true;
    var b = false;
    document.write("(a && b) => ");
    result = (a && b);
    document.write(result);
 </script>
 
 </body>
</html>

Logical OR

If any of two operands become non-zero the condition will result to true.

Let me show you through example:

Logical Operator OR in Javascript Example - Learn Javascript Online with Rahul Rahi

Logical Operator OR example in Javascript.

<html>
   <body>
      <script type="text/javascript">
              var a = true;
              var b = false;
              document.write("(a && b) => ");
              //result = (a && b);
              result = (a || b);
              document.write(result);
       </script>
   </body>
</html>

Logical NOT

Logical NOT reverse the state of operands. Are you confused? Let me make a brighter flash. If your condition is true then it will make it reverse i.e. false.

Let me show you example:

Logical Operator NOT in Javascript Example - Learn Javascript Online with Rahul Rahi

Logical Operator NOT example in Javascript.

<html>
 <body>
<script type="text/javascript">

       var a = false;
       var b = true;
       document.write("(!(a && b) => ");
       //result = (a && b);
         result = (!(a && b));
       document.write(result);


</script>
</body>
</html>

Bitwise Operators

  1. & (Bitwise AND)
  2. | (BitWise OR)
  3. ~ (Bitwise Not)
  4. ^ (Bitwise XOR)
  5. << (Left Shift)
  6. >> (Right Shift)
  7. >>> (Right shift with Zero)

Let me make a flash on above listed operators.

&(Bitwise AND):

If you want to perform boolean operation on the two operands then its the way.

| (BitWise OR):

It perform boolean OR operation on it each integer of its arguments.

^ (Bitwise XOR)

It performs a Boolean exclusive OR operation on each bit of its integer arguments. Exclusive OR means both operand can’t be true anyone of them can be true.

~ (Bitwise Not)

It is a unary operator and reverse all the bits.

<< (Left Shift)

Left shift moves all the bits to left of its first operand of place mentioned in the second operand. And do remember that new bits are filled by zero’s.

The result is equal to the multiplication of bit by 2 each one shift. And for two left shift it is 4 and so on….

 

>> (Right Shift)

Right shift moves the left operand’s value right by the number of bits specified by the right operand.

>>> (Right shift with Zero)

It is same as >> but only the difference is that the bits shifted in on the left are always zero.

Bitwise Shift operators in Javascript Example - Learn Javascript Online with Rahul Rahi

Bitwise Shift operators in Javascript Example

<html>
 <body>
 <script type="text/javascript">
 var a = 3;
 var b = 5; 
 
 document.write("(a & b) => ");
 result = (a & b);
 document.write(result);
 document.write("<br/>");
 
 document.write("(a | b) => ");
 result = (a | b);
 document.write(result);
 document.write("<br/>");
 
 document.write("(a ^ b) => ");
 result = (a ^ b);
 document.write(result);
 document.write("<br/>");
 
 document.write("(~b) => ");
 result = (~b);
 document.write(result);
 document.write("<br/>");
 
 document.write("(a << b) => ");
 result = (a << b);
 document.write(result);
 document.write("<br/>");
 
 document.write("(a >> b) => ");
 result = (a >> b);
 document.write(result);
 document.write("<br/>");

document.write("(a >>> b) => ");
 result = (a >> b);
 document.write(result);
 document.write("<br/>");
 
 </script>
 </body>
</html>

Coming soon! This post will be updated soon…

Assignment Operators

Assignment operator works like process and fire. It first calculates the value and assigns to the variable it needs to be assigned. Like adding two numbers a,b. And assigning it to the variable c.

  1. = (Simple Assignment )
  2. += (Add and Assignment)
  3. −= (Subtract and Assignment)
  4. *= (Multiply and Assignment)
  5. /= (Divide and Assignment)
  6. %= (Modules and Assignment)

= Simple Assignment

A simple assignment that is =, work in a very simple way. It just assigns value that’s it. It’s all task over. e.g. a = 2. a is assigned with 2 numeric value.

+= (Add and Assignment)

This is addition first and then assignment. Like it will add the two operands and assign the resultant value to the designated variable. e.g. a = 2 and b = 3, after that c +=b which means (c = c+b). Operation will start from right side to left side. Addition and assignment.

All the other will work in the same way as above only the funtion is different like substraction, multiplication etc.

Now I am directly giving the example here:

Assignment operators in in Javascript Example - Learn Javascript Online with Rahul Rahi

Assignment operators in Javascript Example

Code of the above example is here:

<html>
 <body>
 
 <script type="text/javascript">
 
 var a = 12;
 var b = 10;
 
 document.write("Value of a => (a = b) => ");
 result = (a = b);
 document.write(result);
 document.write("<br />");
 
 document.write("Value of a => (a += b) => ");
 result = (a += b);
 document.write(result);
 document.write("<br />");
 
 document.write("Value of a => (a -= b) => ");
 result = (a -= b);
 document.write(result);
 document.write("<br />");
 
 document.write("Value of a => (a *= b) => ");
 result = (a *= b);
 document.write(result);
 document.write("<br />");
 
 document.write("Value of a => (a /= b) => ");
 result = (a /= b);
 document.write(result);
 document.write("<br />");
 
 document.write("Value of a => (a %= b) => ");
 result = (a %= b);
 document.write(result);
 document.write("<br />");
 
 </script>
 
 
 </body>
</html>

 

Leave a Reply

CONTACT ME