JavaScript operators are symbols or keywords used to perform operations on values and variables. They are an essential part of JavaScript because they allow you to perform calculations, compare values, assign data, and build logical conditions.

For example:

let a = 10;
let b = 5;

console.log(a + b);

Here, + is an operator used to add two numbers.

In this tutorial, you will learn about the different types of JavaScript operators with simple examples.

What Are Operators in JavaScript?

An operator performs an operation on one or more values.

let a = 10;
let b = 20;

let result = a + b;

In this example:

• a and b are operands.
• + is the operator.
• result stores the result of the operation.

JavaScript provides several types of operators:

1. Arithmetic Operators
2. Assignment Operators
3. Comparison Operators
4. Logical Operators
5. Increment and Decrement Operators
6. Unary Operators
7. Ternary Operator
8. Nullish Coalescing Operator
9. Optional Chaining Operator
10. Bitwise Operators
11. Exponentiation Operator

---

1. Arithmetic Operators

Arithmetic operators are used to perform mathematical calculations.

The most commonly used arithmetic operators are:

Operator	Name	Example
+	Addition	10 + 5
-	Subtraction	10 - 5
*	Multiplication	10 * 5
/	Division	10 / 5
%	Remainder	10 % 3
**	Exponentiation	2 ** 3

Addition

The + operator adds two numbers.

let a = 10;
let b = 5;

console.log(a + b);

Output:

15

The + operator can also concatenate strings:

let firstName = "Harshit";
let lastName = "Sharma";

console.log(firstName + " " + lastName);

Output:

Harshit Sharma

This is an important JavaScript behavior: + can perform either numeric addition or string concatenation depending on the values.

---

Subtraction

The - operator subtracts one number from another.

let a = 20;
let b = 5;

console.log(a - b);

Output:

15

---

Multiplication

The * operator multiplies two values.

let price = 100;
let quantity = 3;

console.log(price * quantity);

Output:

300

---

Division

The / operator divides one value by another.

let total = 100;
let people = 4;

console.log(total / people);

Output:

25

JavaScript allows division by zero, but the result can be Infinity.

console.log(10 / 0);

Output:

Infinity

---

Remainder Operator %

The % operator returns the remainder after division.

console.log(10 % 3);

Output:

1

This operator is commonly used to check whether a number is even or odd.

let number = 10;

if (number % 2 === 0) {
    console.log("Even");
}

Output:

Even

---

Exponentiation Operator **

The ** operator calculates a number raised to a power.

console.log(2 ** 3);

Output:

8

It means:

2 × 2 × 2 = 8

---

2. Assignment Operators

Assignment operators are used to assign values to variables.

The basic assignment operator is:

=

Example:

let age = 25;

Here, = assigns 25 to the age variable.

JavaScript also provides compound assignment operators.

Operator	Example	Equivalent
=	x = 10	x = 10
+=	x += 5	x = x + 5
-=	x -= 5	x = x - 5
*=	x *= 5	x = x * 5
/=	x /= 5	x = x / 5
%=	x %= 5	x = x % 5
**=	x **= 2	x = x ** 2

+=

let score = 10;

score += 5;

console.log(score);

Output:

15

This is equivalent to:

score = score + 5;

-=

let score = 10;

score -= 3;

console.log(score);

Output:

7

*=

let price = 100;

price *= 2;

console.log(price);

Output:

200

---

3. Comparison Operators

Comparison operators compare two values and return a Boolean value:

true

or:

false

Common comparison operators include:

Operator	Meaning
==	Equal to
===	Strictly equal to
!=	Not equal to
!==	Strictly not equal to
>	Greater than
<	Less than
>=	Greater than or equal to
<=	Less than or equal to

---

Equal ==

The == operator compares values after allowing type conversion.

console.log(5 == "5");

Output:

true

Although one value is a number and the other is a string, loose equality considers them equal after type conversion.

---

4. Strict Equality ===

The === operator compares both value and type.

console.log(5 === "5");

Output:

false

Why?

5     → number
"5"   → string

Their types are different.

In modern JavaScript, === is generally preferred when you want predictable equality checks.

Example:

let age = 18;

if (age === 18) {
    console.log("Age is 18");
}

---

5. Not Equal !=

The != operator checks whether two values are not equal, with type conversion allowed.

console.log(10 != 5);

Output:

true

---

6. Strict Not Equal !==

The !== operator checks both value and type.

console.log(5 !== "5");

Output:

true

The values have different types, so the result is true.

---

7. Greater Than >

The > operator checks whether the first value is greater than the second.

console.log(10 > 5);

Output:

true

---

8. Less Than <

The < operator checks whether the first value is smaller than the second.

console.log(5 < 10);

Output:

true

---

9. Greater Than or Equal >=

console.log(10 >= 10);

Output:

true

It returns true when the first value is greater than or equal to the second value.

---

10. Less Than or Equal <=

console.log(5 <= 10);

Output:

true

---

11. Logical Operators

Logical operators are commonly used when creating conditions.

JavaScript provides three main logical operators:

Operator	Name
&&	AND
`
!	NOT

---

AND &&

The && operator returns a truthy result only when both conditions are satisfied.

let age = 25;
let hasLicense = true;

if (age >= 18 && hasLicense) {
    console.log("You can drive.");
}

Both conditions must be true.

---

OR ||

The || operator returns a truthy result when at least one condition is true.

let isAdmin = false;
let isManager = true;

if (isAdmin || isManager) {
    console.log("Access granted.");
}

Here, isManager is true, so the condition succeeds.

---

NOT !

The ! operator reverses a Boolean value.

let isLoggedIn = false;

console.log(!isLoggedIn);

Output:

true

Because:

!false → true

---

12. Increment Operator ++

The ++ operator increases a value by one.

let count = 10;

count++;

console.log(count);

Output:

11

This is equivalent to:

count = count + 1;

---

13. Decrement Operator --

The -- operator decreases a value by one.

let count = 10;

count--;

console.log(count);

Output:

9

---

Prefix vs Postfix Operators

The increment and decrement operators can be used before or after a variable.

Postfix

let x = 5;

console.log(x++);

Output:

5

The value is returned first, then incremented.

console.log(x);

Output:

6

Prefix

let x = 5;

console.log(++x);

Output:

6

The value is incremented first and then returned.

The same concept applies to --.

---

14. Ternary Operator

The ternary operator is a short way of writing a simple conditional expression.

Syntax:

condition ? valueIfTrue : valueIfFalse

Example:

let age = 20;

let result = age >= 18 ? "Adult" : "Minor";

console.log(result);

Output:

Adult

The equivalent if...else code is:

let result;

if (age >= 18) {
    result = "Adult";
} else {
    result = "Minor";
}

The ternary operator is useful for short conditions, but deeply nested ternary expressions can make code difficult to read.

---

15. Nullish Coalescing Operator ??

The nullish coalescing operator returns a fallback value when the left-hand side is null or undefined.

let username = null;

let displayName = username ?? "Guest";

console.log(displayName);

Output:

Guest

Another example:

let name;

let displayName = name ?? "Guest";

console.log(displayName);

Output:

Guest

An important difference exists between ?? and ||.

For example:

let value = 0;

console.log(value || 100);

Output:

100

But:

console.log(value ?? 100);

Output:

0

|| treats 0, false, and "" as falsy, while ?? only falls back for null and undefined.

---

16. Optional Chaining Operator ?.

Optional chaining allows you to safely access properties that may not exist.

Consider:

let user = {};

console.log(user.address.city);

This causes an error because address does not exist.

Using optional chaining:

console.log(user.address?.city);

The result is:

undefined

You can also use it with multiple levels:

console.log(user?.address?.city);

Optional chaining is especially useful when working with API responses where some properties may be missing.

---

17. Bitwise Operators

Bitwise operators work with numbers at the binary level.

Common bitwise operators include:

Operator	Name
&	AND
`	`
^	XOR
~	NOT
<<	Left shift
>>	Right shift
>>>	Unsigned right shift

Example:

console.log(5 & 1);

Bitwise operators are generally used in specialized programming tasks rather than everyday web application code.

If you are a beginner, focus first on arithmetic, assignment, comparison, logical, and conditional operators.

---

Operator Precedence

When an expression contains multiple operators, JavaScript follows operator precedence rules.

For example:

let result = 10 + 5 * 2;

console.log(result);

Output:

20

Multiplication is performed before addition:

5 * 2 = 10
10 + 10 = 20

You can use parentheses to make the intended order explicit:

let result = (10 + 5) * 2;

console.log(result);

Output:

30

Using parentheses can make complex expressions easier to understand.

---

JavaScript Operators Example

Here is an example combining several operators:

let price = 1000;
let quantity = 2;
let discount = 100;

let total = price * quantity;
total -= discount;

let isEligible = total >= 1000;

console.log("Total:", total);
console.log("Eligible:", isEligible);

Output:

Total: 1900
Eligible: true

This example uses:

• * for multiplication
• -= for assignment
• >= for comparison

---

Common Mistakes with JavaScript Operators

Using = instead of ===

Incorrect:

if (age = 18) {
    console.log("18");
}

Here, = assigns a value instead of comparing values.

Prefer:

if (age === 18) {
    console.log("18");
}

---

Confusing == and ===

5 == "5";   // true
5 === "5";  // false

For predictable comparisons, prefer strict equality in most application code.

---

Confusing && and ||

Remember:

&& → AND → both conditions need to be true
|| → OR  → at least one condition needs to be true

---

Forgetting Operator Precedence

This:

10 + 5 * 2

is not the same as:

(10 + 5) * 2

Use parentheses when they make the intended calculation clearer.

---

JavaScript Operators Cheat Sheet

Category	Operators
Arithmetic	+, -, *, /, %, **
Assignment	=, +=, -=, *=, /=, %=
Comparison	==, ===, !=, !==, >, <, >=, <=
Logical	&&, `
Increment/Decrement	++, --
Conditional	? :
Nullish	??
Optional Chaining	?.
Bitwise	&, `

---

Frequently Asked Questions

What is an operator in JavaScript?

An operator is a symbol or keyword that performs an operation on one or more values.

For example:

10 + 5

Here, + is the operator.

What is the difference between == and ===?

== allows type conversion before comparison, while === checks both value and type without performing that conversion.

5 == "5";   // true
5 === "5";  // false

What does % do in JavaScript?

The % operator returns the remainder after division.

10 % 3

returns:

1

What does && mean in JavaScript?

&& is the logical AND operator. It is commonly used when multiple conditions must be satisfied.

What does || mean in JavaScript?

|| is the logical OR operator. It is commonly used when at least one condition should be satisfied.

What is the ternary operator?

The ternary operator is a short syntax for a simple conditional expression.

let result = age >= 18 ? "Adult" : "Minor";

What is the difference between ?? and ||?

?? uses the fallback only when the value is null or undefined. || also treats other falsy values such as 0, false, and an empty string as needing the fallback.

---

Practice Exercises

Try these exercises before moving to the next JavaScript tutorial:

1. Add two numbers using the + operator.
2. Calculate the total price of three products.
3. Find the remainder of 25 / 4.
4. Check whether a number is even or odd.
5. Compare two numbers using ===.
6. Check whether a user is at least 18 years old.
7. Use && to check two conditions.
8. Use || to check whether either of two conditions is true.
9. Create a ternary expression to check whether a user is an adult.
10. Use ?? to provide a default username.
11. Use optional chaining to safely access a nested object property.
12. Create an expression that uses multiple arithmetic operators and explain its precedence.

Conclusion

JavaScript operators are fundamental to writing JavaScript programs. They allow you to perform calculations, assign values, compare data, create conditions, and work with optional or missing values.

For beginners, focus first on these operators:

• Arithmetic operators
• Assignment operators
• Comparison operators
• Logical operators
• Increment and decrement operators
• Ternary operator

After understanding these, learn modern operators such as ?? and ?..

In the next tutorial, we will learn about JavaScript Type Conversion and Type Coercion, including why expressions such as "5" + 2 and "5" - 2 produce different results.