site logo

Master JavaScript — Build, Create, and Innovate


Category: (All)
❮  Go Back

04. Deep Dive into JavaScript Operators: Arithmetic, Assignment & Comparison

Introduction

Operators are the building blocks that let JavaScript perform calculations, assign values, compare data, and more. Understanding how different kinds of operators work is essential for writing functional, bug-free code. In this post, we explore:

  1. Arithmetic operators
  2. Assignment operators
  3. Comparison operators
  4. How they behave in JavaScript


1. Arithmetic Operators

Arithmetic operators let you perform mathematical operations. Here are the most common ones:

OperatorDescriptionExample+Addition5 + 3 results in 8-Subtraction10 - 4 results in 6*Multiplication7 * 2 results in 14/Division20 / 4 results in 5%Modulus (remainder)9 % 4 results in 1**Exponentiation2 ** 3 results in 8++Increment by 1x++ increases x by 1--Decrement by 1x-- decreases x by 1

Examples:


let a = 5;
let b = 3;
console.log(a + b); // 8
console.log(a % b); // 2
console.log(2 ** 4); // 16

let x = 10;
x++;
console.log(x); // 11
x--;
console.log(x); // 10

Note on precedence:

Arithmetic operators follow order of operations (parentheses first, then exponents, then multiplication/division/modulus, then addition/subtraction). Use parentheses to control calculation order when needed.


2. Assignment Operators

Assignment operators combine operation and assignment in a compact form.

  1. = — basic assignment
  2. += — add and assign
  3. -= — subtract and assign
  4. *= — multiply and assign
  5. /= — divide and assign
  6. %= — modulus and assign
  7. **= — exponentiate and assign

Examples:


let value = 10;
value += 5; // equivalent to value = value + 5; now 15
value *= 2; // now 30
value %= 7; // now 2 (because 30 mod 7 is 2)
value **= 3; // now 8 (2 cubed)

These operators make your code shorter and clearer.


3. Comparison Operators

Comparison operators evaluate relationships between values and return a boolean (true or false).

  1. == — equal to (does type coercion)
  2. === — strict equal (no type conversion)
  3. != — not equal (with type conversion)
  4. !== — strict not equal (no type conversion)
  5. > — greater than
  6. < — less than
  7. >= — greater than or equal
  8. <= — less than or equal

Examples:


console.log(5 == "5"); // true, because "5" is converted to 5
console.log(5 === "5"); // false, because types differ
console.log(5 != "5"); // false
console.log(5 !== "5"); // true
console.log(7 > 3); // true
console.log(2 <= 2); // true

Tip:

Prefer === and !== over == and != to avoid unexpected results due to automatic type conversion.


4. Combining Operators & Pitfalls

4.1 Operator Chaining

You can combine multiple operations in a single statement:


let result = (a + b) * c / d - e;

Use parentheses to control order and ensure clarity.

4.2 Implicit Type Conversion

When operators mix types (e.g., string and number), JavaScript may convert types implicitly:


console.log("5" + 2); // "52" (number 2 converted to string)
console.log("10" - 3); // 7 (string "10" is converted to number)

This behavior may cause bugs, so be mindful of operand types. Using explicit conversion (Number(), String()) helps control outcomes.

4.3 NaN and Infinity

Some arithmetic operations can result in special values:

  1. 0 / 0 → NaN (Not a Number)
  2. Division by zero (nonzero / 0) → Infinity or -Infinity
  3. Operations involving NaN propagate NaN

Check with isNaN() to detect invalid results:


let z = NaN;
console.log(isNaN(z)); // true


Conclusion

JavaScript’s operators allow you to perform math, assign values, and compare data. Mastering how they work—especially the nuances of assignment shorthand and comparison—lays a strong foundation for more advanced coding tasks.

04. Deep Dive into JavaScript Operators Arithmetic Assignment Comparison

coldshadow44 on 2025-10-12



(0)





Showing comments related to this post.




Member's Sites: