Day 7: Nullish Coalescing Operator (??) — “The Better ||” 🎯

You’ve been using || for default values your whole JavaScript life. But what if I told you there's a better way? Meet ?? — the operator that actually understands what "missing" means.

Today’s Mission

• Understand what the ?? (nullish coalescing) operator does
• Learn why ?? is often better than || for default values
• Master when to use each operator
• Avoid the subtle bugs that || can introduce
• Write cleaner, more predictable code

The Problem with ||

You’ve probably written code like this:

const username = user.name || "Anonymous";
const count = items.length || 0;
const price = product.price || 0;

But here’s the catch: || returns the right side for any falsy value, not just null or undefined.

What are falsy values again? false, 0, '', NaN, null, undefined.

The Problem:

const count = items.length || 0;  // What if items.length is 0?
// If items.length is 0, it's falsy, so we get 0... wait, that works!

// But what about this?
const price = product.price || 0;  // What if price is 0?
// If price is 0, it's falsy, so we get 0... but 0 might be a valid price!

Real-world bug:

function displayPrice(price) {
  const displayPrice = price || "Free"…