# Operators In JavaScript

The operator is a symbol that performs a specific operation on one or more operands (values or variables) and produces a result. Operators are an essential part of any programming language and are used to manipulate data and variables. These are the different types of operators we are going to talk about in this article.

* Assignment Operator
    
* Arithmetic Operator
    
* Comparison Operator
    
* Logical Operator
    
* Ternary Operator
    

> An operand is a value or variable on which an operator performs an operation.

# Assignment Operator

The assignment operator `=` is used to assign value to a variable. The value of the right operand is assigned to the left operand.

```javascript
let age = 36 // here 36 will be assigned to variable age.
let fruits = ['Banana',"grapes","guava"]
```

# Arithmetic Operator

We can perform standard arithmetic operations on numbers using the arithmetic operators in JavaScript. Following are some of the many arithmetic operators in JavaScript.

* Addition `+`
    
* Subtraction `-`
    
* Multiplication `*`
    
* Division `/`
    
* Modulus `%` (also known as remainder)
    
* Increment `++`
    
* Decrement `--`
    

## Addition

The addition operator is used when we want to find the sum of two or more numbers.

```javascript
console.log(5 + 5); // 10
```

We can also use the Addition operator to join two or more strings together, This is known as string concatenation.

```javascript
let firstName = "John ";
let lastName = "Kumar";
console.log(firstName + lastName); // John Kumar
```

## Subtraction

The subtraction operator is used to find the difference between numbers.

```javascript
console.log(55 - 2); //53
console.log(55.235 - 23.87); //31.365
console.log(10 - 2 + 5); // 13 This is definitely wrong answer according to bodmas rule.
```

In the above example, line 3 is giving us the wrong answer because of the *<mark>order of precedence.</mark>* Both addition and subtraction have the same order of precedence so they are evaluated Right to the left that's why subtraction is being evaluated first. Here is how we can correct that.

```javascript
console.log(10 - (2 + 5)); // 3
```

Now the expression inside the parenthesis will be evaluated first because of the order of precedence.

## Division (/)

The division operator is used to find the quotient.

```javascript
console.log(55 / 5);  // 11
```

## Modulus(%)

The modulus operator is used to find the remainder.

```javascript
console.log(56 % 5); // 1
```

## Increment (++)

The JavaScript increment operator (++) is used to increment (add 1 to) a variable's value. It can be used in both postfix and prefix notation. In postfix notation (i++), the current value of the variable is returned, and then the value is incremented. In prefix notation (++i), the value is incremented first, and then the new value is returned. It's important to note that the increment operator (++) only works on numbers and will result in a NaN if used on a non-numeric value.

```javascript
let x = 5;
console.log(x++); // Output: 5
console.log(x); // Output: 6

let y = 5;
console.log(++y); // Output: 6
console.log(y); // Output: 6
```

## Decrement (--)

The JavaScript decrement operator (--) is used to decrement (subtract 1 from) a variable's value. It can be used in both postfix and prefix notation. In postfix notation (i--), the current value of the variable is returned, and then the value is decremented. In prefix notation (--i), the value is decremented first, and then the new value is returned.

```javascript
let x = 5;
console.log(x--); // Output: 5
console.log(x); // Output: 4

let y = 5;
console.log(--y); // Output: 4
console.log(y); // Output: 4
```

# Comparison Operator

A comparison Operator is used to compare two or more operands. These are the different types of comparison operators.

## Equal (==)

The equal operator returns `ture` if both the operands are the same, it does not check the type of the operands.

```javascript
const var1 = 10;
const var2 = 20;
const var3 = "10";
const var4 = 10;
console.log(var1 == var2); // false
console.log(var1 == var3); // true both variable have same value but they are of different type
console.log(var1 == var4); //true
```

## Strict equal (===)

This operator is the same as the `equal` operator, but it also checks the type of operands.

```javascript
const var1 = 10;
const var2 = 20;
const var3 = "10";
const var4 = 10;
console.log(var1 === var2); // false --different value
console.log(var1 === var3); // false --because both value is of different type
console.log(var1 === var4); //true --same value same type
```

## Not Equal (!=)

This operator returns `true` if the operands are not equal and return `false` if they are equal.

```javascript
const var1 = 10;
const var2 = 20;
const var3 = "10";
const var4 = 10;
console.log(var1 != var2); // true -- different value
console.log(var1 != var3); // false -- same value
console.log(var1 != var4); //false -- same value
```

## Strict Not Equal (!==)

This operator returns `true` if the operands are not equal and of the same type, else it returns `false.`

```javascript
const var1 = 10;
const var2 = 20;
const var3 = "10";
const var4 = 10;
console.log(var1 !== var2); // true -- different values
console.log(var1 !== var3); // true -- same value, different type
console.log(var1 !== var4); // false -- same value, same type
```

## Few More (&gt;,&gt;=,&lt;,&lt;=)

```javascript
const var1 = 10;
const var2 = 20;
const var3 = 10;

// Greater than
console.log(var1 > var2); // false
console.log(var2 > var1); //true

// Less than
console.log(var1 < var2); // true
console.log(var2 < var1); // false

// Greater than or equal 
console.log(var1 >= var2); // false
console.log(var2 >= var1); // true
console.log(var1 >= var3); // true

// Less than or equal
console.log(var1 <= var2); // true
console.log(var2 <= var1); // false
console.log(var1 <= var3); // true
```

| Operator | Description | Example |
| --- | --- | --- |
| Greater Than (&gt;) | Return `true` if the left operand is greater than the right operand | see the above code example. |
| Less Than(&lt;) | Returns `true` if the left operand is less than the right operand | see the above code example. |
| Greater Than or Equal (&gt;=) | Evaluates to `true` if the value on the left is greater than or equal to the value on the right. | see the above code example. |
| Less Than or Equal(&lt;=) | Evaluates to `true` if the value on the left is less than or equal to the value on the right. | see the above code example. |

# Logical Operator

A logical operator evaluates expressions and returns a boolean value indicating whether a specific condition is true or false. When used with boolean operands, these operators will return a boolean result; when used with non-boolean values, they will produce a non-boolean result. There are three different types of logical operators in JavaScript.

* OR (||)
    
* AND (&&)
    
* NOT(!)
    

## OR

The `OR` the operator is represented by a double vertical line `||` . `OR` The operator returns `true` if any of its expressions evaluates to `true` otherwise, it returns false. If the `OR` operator is used with non-boolean values then it returns non-boolean values.

> Syntax:
> 
> expression1 || expression2
> 
> * if expression 1 is evaluated to true then it returns expession 1 otherwise exprssion2
>     
> * logical OR expression is evaluated left to right, so if the first expression is evaluated to true, then it doesnot check the next expression.
>     
> * if all the expression evaluates to false then it reaturn false.
>     

```javascript
const var1 = 10;
const var2 = 20;
const var3 = 10;

console.log(var1 > var2 || var2 > var1);// true
console.log(true || true); // true
console.log(false || true); // true
console.log(true || false); // true
console.log(false || false); // false
```

## AND (&&)

The `AND` operator is represented by two ampersands `&&` sign. The `AND` operator return `true` if all of its conditions evaluates to `true` if any of its conditions evaluates to `false` it returns `false`.

> Syntax:
> 
> expression 1 && expression 2
> 
> * returns `true` if both the conditions if true otherwise it returns `false`
>     
> * AND operator is evaluated from left to right, so if any expression evaluates to false it doesn't evaluates any expression after that.
>     
> * it returns last last operand if all the expression evalutes to 'true\`
>     

```javascript
const var1 = 10;
const var2 = 20;
const var3 = 10;

console.log(var1 > var2 && var2 > var1); // false && true
console.log(true && true); // true
console.log(false && true); // false
console.log(true && false); // false
console.log(false && false); // false
```

## NOT (!)

The `NOT` the operator is represented by an explanation `!` sign. The `!` operator can be applied to boolean and non-boolean values. When used with a boolean value, it returns the opposite of that value, i.e. if the value is false it returns true, and if the value is true it returns false.

```javascript
console.log(!true); //false
console.log(!false); //true
console.log(!0); //true
console.log(!"Hello"); // false
```

# Ternary Operator

Ternary Operator takes three operands and returns values based on the condition.

> Syntax:
> 
> condition ? expression 1 : expression2
> 
> * if the condition is true then it returns expression1 and if the expression if false it returns expression2
>     

```javascript
const var1 = 10;
const var2 = 20;

console.log(var2 > var1 ? "true" : "false"); // true
console.log(var1 > var2 ? "true" : "false"); // false
```

# Conclusion

In this article I have only talked about the operators which are used most, there are a few more operators, and if you want to explore more then you can read about them here.

[Click Here](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Expressions_and_Operators)