दिन 17: this, Classes और Object-Oriented JS

'use strict';
const shop = {
  name: 'Sharma Sweets',
  greet() { return `Welcome to ${this.name}`; },      // 1. method call → this = the object before the dot
  later() { return [1].map(() => this.name)[0]; },    // 2. arrow → this from the surrounding method
};
console.log(shop.greet());
console.log(shop.later());

const loose = shop.greet;                             // 3. plain call → this is undefined (strict mode)
try { loose(); } catch (e) { console.log('Lost this:', e.message); }

const bound = shop.greet.bind(shop);                  // 4. bind/call/apply set this explicitly
console.log(bound());
console.log(shop.greet.call({ name: 'Gupta Bakery' }));

class Product {
  constructor(id, name, price, stock = 0) {   // runs on new Product(...)
    this.id = id;
    this.name = name;
    this.price = price;
    this.stock = stock;
  }
  get inStock() { return this.stock > 0; }   // getter – used like a property
  priceFor(kg) { return Math.round(this.price * kg); }
  toString() { return `${this.name} (₹${this.price}/kg)`; }
}

const kaju = new Product(1, 'Kaju Katli', 900, 25);
const kalakand = new Product(5, 'Kalakand', 600);
console.log(String(kaju), kaju.priceFor(1.5), kaju.inStock);
console.log(`${kalakand}`, kalakand.inStock);
console.log(typeof Product, kaju instanceof Product);

class Cart {
  #items = new Map();                 // private field: id → { product, qty }
  static FREE_DELIVERY = 1500;
  static DELIVERY_CHARGE = 60;

  add(product, qty = 1) {
    if (qty <= 0) throw new Error('Quantity must be positive');
    const line = this.#items.get(product.id);
    this.#items.set(product.id, { product, qty: (line?.qty ?? 0) + qty });
    return this;                       // allows chaining: cart.add(a).add(b)
  }
  remove(id) { this.#items.delete(id); return this; }
  get count() { return [...this.#items.values()].reduce((n, l) => n + l.qty, 0); }
  get subtotal() { return [...this.#items.values()].reduce((s, l) => s + l.product.price * l.qty, 0); }
  get delivery() { return this.subtotal === 0 || this.subtotal >= Cart.FREE_DELIVERY ? 0 : Cart.DELIVERY_CHARGE; }
  get total() { return this.subtotal + this.delivery; }
  lines() { return [...this.#items.values()].map(l => `${l.product.name} × ${l.qty} = ₹${l.product.price * l.qty}`); }
}

const cart = new Cart();
cart.add({ id: 1, name: 'Kaju Katli', price: 900 }, 1)
    .add({ id: 4, name: 'Besan Ladoo', price: 500 })
    .add({ id: 1, name: 'Kaju Katli', price: 900 }, 0.5);
console.log(cart.lines().join('\n'));
console.log(`Items ${cart.count} · subtotal ₹${cart.subtotal} · delivery ₹${cart.delivery} · total ₹${cart.total}`);
console.log(cart.items, Object.keys(cart));          // #items is truly private
try { cart.add({ id: 9, name: 'X', price: 1 }, 0); } catch (e) { console.log('Error:', e.message); }

class Product {
  constructor(name, price) { this.name = name; this.price = price; }
  label() { return `${this.name} – ₹${this.price}`; }
}
class GiftBox extends Product {
  constructor(name, price, contents) {
    super(name, price);                 // call the parent constructor FIRST
    this.contents = contents;
  }
  label() {                             // override, but reuse the parent version
    return `${super.label()} 🎁 (${this.contents.join(', ')})`;
  }
}
const box = new GiftBox('Assorted Box', 720, ['Kaju Katli', 'Ladoo', 'Soan Papdi']);
console.log(box.label());
console.log(box instanceof GiftBox, box instanceof Product);

<div id="menu"></div>
<pre id="summary" style="background:#fefce8;padding:10px;border-radius:8px"></pre>

<script>
class Cart {
  #items = new Map();                 // private field: id → { product, qty }
  static FREE_DELIVERY = 1500;
  static DELIVERY_CHARGE = 60;

  add(product, qty = 1) {
    if (qty <= 0) throw new Error('Quantity must be positive');
    const line = this.#items.get(product.id);
    this.#items.set(product.id, { product, qty: (line?.qty ?? 0) + qty });
    return this;                       // allows chaining: cart.add(a).add(b)
  }
  remove(id) { this.#items.delete(id); return this; }
  get count() { return [...this.#items.values()].reduce((n, l) => n + l.qty, 0); }
  get subtotal() { return [...this.#items.values()].reduce((s, l) => s + l.product.price * l.qty, 0); }
  get delivery() { return this.subtotal === 0 || this.subtotal >= Cart.FREE_DELIVERY ? 0 : Cart.DELIVERY_CHARGE; }
  get total() { return this.subtotal + this.delivery; }
  lines() { return [...this.#items.values()].map(l => `${l.product.name} × ${l.qty} = ₹${l.product.price * l.qty}`); }
}

const products = [
  { id: 1, name: 'Kaju Katli', price: 900 },
  { id: 2, name: 'Malai Ghewar', price: 650 },
  { id: 4, name: 'Besan Ladoo', price: 500 },
];
const cart = new Cart();
const menu = document.querySelector('#menu');
for (const p of products) {
  const btn = document.createElement('button');
  btn.textContent = `+ ${p.name} (₹${p.price})`;
  btn.addEventListener('click', () => { cart.add(p, 0.5); show(); });
  menu.append(btn, ' ');
}
function show() {
  document.querySelector('#summary').textContent = cart.count
    ? cart.lines().join('\n') + `\n\nSubtotal ₹${cart.subtotal}\nDelivery ₹${cart.delivery}\nTotal ₹${cart.total}`
    : 'Cart is empty – add ½ kg of anything';
}
show();
</script>