All TutorialsCoursesEvents & Contests

Module

Operators in JavaScript

Operators in JavaScript

Logical Operators in JavaScript

Type Conversion in JavaScript

Modules

Operators in JavaScript

By Mukul Latiyan

Updated on : 14 Oct 2022

17 mins read

Published on : 14 Oct 2022

Introduction to Operators

In JavaScript, we use operators to perform various operations on values or variables.

For Example.

3 * 10   // Result: 30


Here * is an operator that is used to perform multiplication, and 3 and 10 are operands.

Type of Operators in JavaScript

Below is the list of operators that are present in JavaScript and the ones that we will cover in this article.
  • Comparison Operators
  • Logical Operators
  • Arithmetic Operators
  • Assignment Operators
  • Bitwise Operators

Comparison Operators

The comparison operators in JavaScript are used when we want to compare two values. The result of a comparison between values is always a boolean value, i.e., either true or false.

The table shown below depicts the different comparison operators present in JavaScript with their Descriptions.
Group 103548 (1).png
Let's now make use of all of these operators inside a code.
Consider the code shown below.
index.html
<!DOCTYPE html>
<html lang="en">

<head>
        <meta charset="UTF-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>Operators in JavaScript</title>
</head>

<body>
        <h1>Comparison Operators - Example</h1>

        <script>
                // assignment operator
                let x = 10, y = 5;

                console.log('x and y are:', x, y);

                // equal to operator
                let result = x == y;

                console.log('x == y is:', result);

                // not equal to operator
                result = x != y;

                console.log('x != y is', result);

                // strict equal to operator
                result = x === y;

                console.log('x === y is', result);

                // strict not equal to operator

                result = x !== y;

                console.log('x !== y is', result);

                // greater than operator

                result = x > y;

                console.log('x > y is', result);

                // greater than equal to operator

                result = x >= y;

                console.log('x >= y is', result);

                // less than operator

                result = x < y;

                console.log('x < y is', result);

                // less than equal to operator

                result = x <= y;

                console.log('x <= y is', result);
        </script>
</body>

</html>
Explanation - In the above example, we are making use of the different comparison operators that are present in JavaScript on two numeric operands.
If we run the above code in the browser, we should get the following output.
Output:
Comparison Operators Javascript

Logical Operators

Logical operators in JavaScript are used to perform logical operations on operands, and the result of these operations is always a boolean value, i.e., either true or false.

Consider the code snippet shown below for reference.

Code snippet:
const a = 10, b = 5;
( a < 10 ) && ( b > 3 ); // true

Arithmetic Operators

Arithmetic operators in JavaScript are used when we want to perform arithmetic operations. Arithmetic operators available in JavaScript are:
Group 103548 (2).png
Now let's see each of these arithmetic operators in action.

Consider the code shown below.

index.html
<!DOCTYPE html>
<html lang="en">

<head>
        <meta charset="UTF-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>Operators in JavaScript</title>
</head>

<body>
        <h1>Arithmetic Operators - Example</h1>

        <script>
                let x = 10, y = 5;

                console.log('x and y are:', x, y);

                // addition operator
                let result = x + y;

                console.log('x + y is:', result);

                // subtraction operator
                result = x - y;

                console.log('x - y is', result);

                // multiplication operator
                result = x * y;

                console.log('x * y is', result);

                // division operator

                result = x / y;

                console.log('x / y is', result);

                // remainder operator

                result = x % y;

                console.log('x % y is', result);

                // increment operator

                result = x++;

                console.log('x++ is', result);

                // decrement operator

                result = y--;

                console.log('y-- is', result);

                // exponentiation operator

                result = x ** y;

                console.log('x ** y is', result);
        </script>
</body>

</html>
Explanation- In the above example, we have used all the arithmetic operators present in JavaScript.
If we run the above code in the terminal, we will get the following output.
Output:
image1.png
Arithmetic Operators with Numeric Strings

We can also make use of arithmetic operators on numeric strings as well. Let's see an example.

index.html
<!DOCTYPE html>
<html lang="en">

<head>
        <meta charset="UTF-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>Operators in JavaScript</title>
</head>

<body>
        <h2>Arithmetic Operators - Numeric Strings - Example</h2>

        <script>
                let x = "10", y = "5";

                console.log('x and y are:', x, y);

                // addition operator
                let result = x + y;

                console.log('x + y is:', result);

                // subtraction operator
                result = x - y;

                console.log('x - y is', result);

                // multiplication operator
                result = x * y;

                console.log('x * y is', result);

                // division operator

                result = x / y;

                console.log('x / y is', result);

                // remainder operator

                result = x % y;

                console.log('x % y is', result);

                // increment operator

                result = x++;

                console.log('x++ is', result);

                // decrement operator

                result = y--;

                console.log('y-- is', result);

                // exponentiation operator

                result = x ** y;

                console.log('x ** y is', result);
        </script>
</body>

</html>
Explanation - In the above example, we have created two numeric strings, x and y, with values "10" and "5", respectively.

Here, we are using the different arithmetic operators on the numeric strings. If we run the above code in the terminal, we will get the following output.

Output:

image4.png


When we run this code, JavaScript will convert the numeric strings "10" and "5" to their corresponding numeric values, 10 and 5. Then, the arithmetic operations are performed. We will explore this concept of conversion while learning about Type Conversion.

Assignment Operators

Assignment operators are used when we want to assign values to a variable in JavaScript.

One of the most common examples of an assignment operator that we are continuously using is =, which is used when we want to store a value in a variable.

For example,
const name = "Masai School"
Here, the assignment operator, = assigns the value Masai School to the variable name.

Below is the list of commonly used assignment operators.
Group 103548 (3).png
Now that we have mentioned the different assignment operators present in JavaScript, let's create an example where we will make use of each of these assignment operators.

Consider the code shown below.

index.html
<!DOCTYPE html>
<html lang="en">

<head>
        <meta charset="UTF-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>Operators in JavaScript</title>
</head>

<body>
        <h1>Assignment Operators - Example</h1>

        <script>

                // assignment operator
                let x = 10;
                console.log('x is:', x);

                // compound addition assignment operator
                x += 10;        // x = x + 10;
                console.log('x +=10 is:', x);

                // compound subtraction assignment operator
                x -= 10;        // x = x - 10;
                console.log('x -= 10 is:', x);

                // compound multiplication assignment operator
                x *= 10;        // x = x * 10;
                console.log('x += 10 is:', x);

                // compound division assignment operator
                x /= 10;        // x = x / 10;
                console.log('x /= 10 is:', x);

                // compound remainder assignment operator
                x %= 4;        // x = x % 10;
                console.log('x %= 4 is:', x);

                // compound exponentiation assignment operator
                x **= 10;        // x = x ** 10
                console.log('x **= 10 is:', x);

        </script>
</body>

</html>
Explanation - We created a variable named x and then used different assignment operators with that variable and some operand values.

If we run the above code in the browser, we should get the following output.

Output:
Assignment Operators Javascript

Bitwise Operators

The bitwise operators in JavaScript are used to perform bitwise operations. A number in JavaScript is stored in a 64-bit floating-point number. However, if we have to perform bitwise operations, we need to convert the number to a 32-bits binary number because JavaScript only performs operations in 32-bits.

The bitwise operators, in general, can be split into two categories:
  • Bitwise logical operators
  • Bitwise shift operators
Bitwise Logical Operators In total, there are 4 bitwise logical operators. These are:
  • Bitwise AND, &
  • Bitwise OR, |
  • Bitwise XOR, ^
  • Bitwise NOT, ~
Bitwise Shift Operators Also, there are three bitwise shift operators present in JavaScript. These are:
  • Left Shift, <<
  • Sign Propagating Right Shift, >>
  • Zero fill Right Shift, >>>

Quiz

Consider the code snippet shown below, in which you are given two operands, and you need to guess what operator is used to get the desired output.

Code snippet:
let a = 10;
let b = 15;
console.log(b _ a );   // answer = 5

Which one of the following operators can be used in the above code snippet instead of _ to get the answer 5?
Group 103548.png
Correct Answer: 3

Conclusion

In this article, we learned about operators in JavaScript. We also explored various examples of different types of operators available in JavaScript.

Check Out Programs Offered By Masai

If you are currently studying in 1st, 2nd or pre-final year of college,

Connect with a growingcommunity of learners

Masai School

Get StartedJoin the Program