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.

OperatorNameExampleResult
+Addition5 + 38
-Subtraction10 - 46
*Multiplication4 * 312
/Division15 / 35
%Modulus (Remainder)10 % 31
**Exponentiation2 ** 416
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 Kumar

Assignment Operators

Assignment operators assign values to variables. The basic assignment operator is =. Combined operators provide a shorthand for common operations.

OperatorExampleSame As
=x = 5x = 5
+=x += 3x = x + 3
-=x -= 3x = x - 3
*=x *= 3x = x * 3
/=x /= 3x = x / 3
%=x %= 3x = x % 3
**=x **= 3x = 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);  // 260

Comparison Operators

Comparison operators compare two values and return a boolean: true or false. They are used heavily in conditions and loops.

OperatorNameExampleResult
==Equal to (loose)5 == "5"true
===Equal to (strict)5 === "5"false
!=Not equal (loose)5 != 3true
!==Not equal (strict)5 !== "5"true
>Greater than8 > 5true
<Less than3 < 7true
>=Greater than or equal5 >= 5true
<=Less than or equal4 <= 9true

== 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.

OperatorNameDescriptionExample
&&ANDTrue if BOTH conditions are truetrue && false → false
||ORTrue if AT LEAST ONE condition is truetrue || false → true
!NOTReverses 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);  // true

Increment and Decrement Operators

These operators increase or decrease a value by 1.

OperatorNameDescription
++IncrementAdds 1 to the value
--DecrementSubtracts 1 from the value
let count = 5;

count++;
console.log(count);  // 6

count--;
console.log(count);  // 5

Prefix 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);  // Hot

String Operators

The + operator concatenates strings. The += operator appends to an existing string.

let message = "Good ";
message += "Morning";
console.log(message);  // Good Morning

typeof 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);  // undefined

Operator 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);  // true

Key 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

Leave a Comment

Your email address will not be published. Required fields are marked *