JavaScript Operators
Operators are symbols that perform operations on values and variables. They are the building blocks of any computation — from simple math to complex comparisons and logic.
JavaScript has several categories of operators. Understanding them thoroughly is essential for writing any meaningful program.
Arithmetic Operators
Arithmetic operators perform mathematical calculations.
| Operator | Name | Example | Result |
|---|---|---|---|
| + | Addition | 5 + 3 | 8 |
| - | Subtraction | 10 - 4 | 6 |
| * | Multiplication | 4 * 3 | 12 |
| / | Division | 15 / 3 | 5 |
| % | Modulus (Remainder) | 10 % 3 | 1 |
| ** | Exponentiation | 2 ** 4 | 16 |
let a = 10;
let b = 3;
console.log(a + b); // 13
console.log(a - b); // 7
console.log(a * b); // 30
console.log(a / b); // 3.3333...
console.log(a % b); // 1 (remainder of 10 ÷ 3)
console.log(a ** b); // 1000 (10 to the power of 3)The + Operator with Strings
When used with strings, + joins (concatenates) them together:
let firstName = "Ravi";
let lastName = "Kumar";
let fullName = firstName + " " + lastName;
console.log(fullName); // Ravi KumarAssignment Operators
Assignment operators assign values to variables. The basic assignment operator is =. Combined operators provide a shorthand for common operations.
| Operator | Example | Same As |
|---|---|---|
| = | x = 5 | x = 5 |
| += | x += 3 | x = x + 3 |
| -= | x -= 3 | x = x - 3 |
| *= | x *= 3 | x = x * 3 |
| /= | x /= 3 | x = x / 3 |
| %= | x %= 3 | x = x % 3 |
| **= | x **= 3 | x = x ** 3 |
let score = 100;
score += 50; // score = 100 + 50 = 150
console.log(score); // 150
score -= 20; // score = 150 - 20 = 130
console.log(score); // 130
score *= 2; // score = 130 * 2 = 260
console.log(score); // 260Comparison Operators
Comparison operators compare two values and return a boolean: true or false. They are used heavily in conditions and loops.
| Operator | Name | Example | Result |
|---|---|---|---|
| == | Equal to (loose) | 5 == "5" | true |
| === | Equal to (strict) | 5 === "5" | false |
| != | Not equal (loose) | 5 != 3 | true |
| !== | Not equal (strict) | 5 !== "5" | true |
| > | Greater than | 8 > 5 | true |
| < | Less than | 3 < 7 | true |
| >= | Greater than or equal | 5 >= 5 | true |
| <= | Less than or equal | 4 <= 9 | true |
== vs === (Important Difference)
== compares values only (converts types if needed). === compares both value AND type. Always prefer === to avoid unexpected results.
console.log(5 == "5"); // true (values match after type conversion)
console.log(5 === "5"); // false (different types: number vs string)
console.log(0 == false); // true (type conversion)
console.log(0 === false); // false (different types)Logical Operators
Logical operators combine multiple conditions and return a boolean result.
| Operator | Name | Description | Example |
|---|---|---|---|
| && | AND | True if BOTH conditions are true | true && false → false |
| || | OR | True if AT LEAST ONE condition is true | true || false → true |
| ! | NOT | Reverses the boolean value | !true → false |
let age = 20;
let hasID = true;
// AND: both must be true
console.log(age >= 18 && hasID); // true
// OR: at least one must be true
let isWeekend = false;
let isHoliday = true;
console.log(isWeekend || isHoliday); // true
// NOT: reverses the value
let isLoggedIn = false;
console.log(!isLoggedIn); // trueIncrement and Decrement Operators
These operators increase or decrease a value by 1.
| Operator | Name | Description |
|---|---|---|
| ++ | Increment | Adds 1 to the value |
| -- | Decrement | Subtracts 1 from the value |
let count = 5;
count++;
console.log(count); // 6
count--;
console.log(count); // 5Prefix vs Postfix
let x = 10;
// Postfix: use first, then increment
console.log(x++); // 10 (uses current value)
console.log(x); // 11 (now incremented)
let y = 10;
// Prefix: increment first, then use
console.log(++y); // 11 (already incremented)Ternary Operator
The ternary operator is a compact way to write a simple if/else condition in one line. It takes three parts: a condition, a value if true, and a value if false.
Syntax: condition ? valueIfTrue : valueIfFalse
let marks = 75;
let result = marks >= 50 ? "Pass" : "Fail";
console.log(result); // Pass
let temperature = 38;
let weather = temperature > 35 ? "Hot" : "Normal";
console.log(weather); // HotString Operators
The + operator concatenates strings. The += operator appends to an existing string.
let message = "Good ";
message += "Morning";
console.log(message); // Good Morningtypeof Operator
The typeof operator returns the data type of a value as a string.
console.log(typeof 42); // number
console.log(typeof "Hello"); // string
console.log(typeof true); // boolean
console.log(typeof undefined); // undefinedOperator Precedence
When multiple operators appear in an expression, JavaScript follows a priority order called operator precedence. Operators with higher precedence execute first — similar to BODMAS in mathematics.
let result = 2 + 3 * 4;
console.log(result); // 14 (not 20, because * is calculated before +)
let result2 = (2 + 3) * 4;
console.log(result2); // 20 (parentheses change the order)Practical Example
// Simple bill calculator
let itemPrice = 500;
let quantity = 3;
let discount = 50;
let subtotal = itemPrice * quantity;
let finalAmount = subtotal - discount;
let isEligibleForFreeDelivery = finalAmount >= 1000;
console.log("Subtotal:", subtotal); // 1500
console.log("Final Amount:", finalAmount); // 1450
console.log("Free Delivery:", isEligibleForFreeDelivery); // trueKey Points to Remember
- Arithmetic operators perform math operations: +, -, *, /, %, **
- Always prefer
===over==for comparisons - Logical operators combine conditions:
&&(AND),||(OR),!(NOT) - The ternary operator is a shorthand for simple if/else expressions
- Use parentheses to control the order of operations
++and--increment and decrement values by 1
