4.1 Arithmetic & Assignment Operators

Arithmetic operators take numeric values (either literals or variables) as their operands and return a single numeric value. Compound assignment operators evaluate and assign results in a single step.

let cartTotal = 120;
let taxRate = 0.08; // 8% tax
let discount = 15;

// Compound calculations
cartTotal -= discount;       // cartTotal is now 105
cartTotal *= (1 + taxRate);  // cartTotal is now 113.4

console.log("Final Payable: $" + cartTotal.toFixed(2)); // $113.40

4.2 Comparison Operators: Strict (===) vs Loose (==)

Comparison operators test whether two values satisfy a condition and always return a boolean: true or false.

4.4 Logical Operators & Short-Circuit Evaluation

Logical operators are used to determine logic between variables or boolean expressions.

// 1. AND (&&) stops at first FALSY value and returns it
let user = { loggedIn: true, name: "Sanju" };
user.loggedIn && console.log("Welcome back, " + user.name); // Logs message

// 2. OR (||) stops at first TRUTHY value and returns it
let defaultTheme = null;
let activeTheme = defaultTheme || "dark-mode"; // Evaluates to "dark-mode"

4.5 Modern Operators: Ternary, Nullish Coalescing & Optional Chaining

Modern JavaScript (ES2020+) introduced elegant operators that dramatically simplify control logic and prevent runtime TypeError: Cannot read properties of undefined errors.

let age = 20;
let status = (age >= 18) 
  ? "Adult" 
  : "Minor";

let score = 0;
// || replaces 0 with 10 (Bug!)
let a = score || 10; // 10 ❌
// ?? preserves 0 correctly!
let b = score ?? 10; // 0 ✅

let user = {};
// Returns undefined safely!
let city = user?.address?.city;
console.log(city); // undefined

4.6 Operator Precedence & Grouping

Operator precedence determines the order in which operators are parsed when evaluating an expression. Operators with higher precedence are evaluated first.

Select preset JavaScript operator expressions or type your own custom expression to test operator precedence, short-circuiting, and coercion results live.

Build an e-commerce price calculator that takes a base price, applies a coupon if present using the Nullish Coalescing (??) operator, checks if the customer qualifies for free shipping using logical AND (&&), and computes the final formatted total using a ternary operator.

function calculateSmartTotal(basePrice, couponDiscount, isVipMember) {
  // 1. Nullish coalescing preserves 0 discount
  const discount = couponDiscount ?? 5;
  
  // 2. Subtotal after discount
  const subtotal = basePrice - discount;
  
  // 3. Ternary operator for free shipping qualification
  const shippingFee = (subtotal >= 50 || isVipMember) ? 0 : 9.99;
  
  const finalTotal = subtotal + shippingFee;
  
  console.log(`Subtotal: $${subtotal.toFixed(2)}, Shipping: $${shippingFee.toFixed(2)}, Total: $${finalTotal.toFixed(2)}`);
  return finalTotal;
}

// Test Case: $0 discount with VIP status
calculateSmartTotal(80, 0, true); 
// Output: Subtotal: $80.00, Shipping: $0.00, Total: $80.00