OOP và Prototypes trong JavaScript hiện đại

// Cách rời rạc — khó quản lý
const userName = "Alice";
const userAge = 30;

function greetUser(name) {
  return `Hello, ${name}!`;
}

// Encapsulation — gom lại vào một object
const user = {
  name: "Alice",
  age: 30,
  greet() {
    return `Hello, ${this.name}!`;
  },
  isAdult() {
    return this.age >= 18;
  },
};

console.log(user.greet());    // Hello, Alice!
console.log(user.isAdult());  // true

function createUser(name, age, role) {
  return {
    name,
    age,
    role,
    greet() {
      return `Hello, I'm ${this.name} (${this.role})`;
    },
    isAdult() {
      return this.age >= 18;
    },
    describe() {
      return `${this.name}, ${this.age} tuổi`;
    },
  };
}

const alice = createUser("Alice", 30, "admin");
const bob = createUser("Bob", 17, "user");

console.log(alice.greet());   // Hello, I'm Alice (admin)
console.log(bob.isAdult());   // false

// Object chứa các method dùng chung
const userMethods = {
  greet() {
    return `Hello, I'm ${this.name}`;
  },
  isAdult() {
    return this.age >= 18;
  },
  describe() {
    return `${this.name}, ${this.age} tuổi`;
  },
};

function createUser(name, age) {
  const user = Object.create(userMethods); // Tạo object có prototype là userMethods
  user.name = name;
  user.age = age;
  return user;
}

const alice = createUser("Alice", 30);
const bob = createUser("Bob", 17);

console.log(alice.greet());   // Hello, I'm Alice
console.log(bob.greet());     // Hello, I'm Bob

// Cả hai cùng dùng một hàm greet duy nhất trong bộ nhớ
console.log(alice.greet === bob.greet); // true ✅

const userMethods = {
  greet() {
    return `Hello, I'm ${this.name}`;
  },
  isAdult() {
    return this.age >= 18;
  },
  describe() {
    return `${this.name}, ${this.age} tuổi`;
  },
};

const adminMethods = Object.create(userMethods); // adminMethods kế thừa userMethods

adminMethods.ban = function (target) {
  return `${this.name} đã ban ${target}`;
};

function createAdmin(name, age) {
  const admin = Object.create(adminMethods);
  admin.name = name;
  admin.age = age;
  return admin;
}

const aliceAdmin = createAdmin("Alice", 30);

console.log(aliceAdmin.ban("Bob"));   // Alice đã ban Bob       (adminMethods)
console.log(aliceAdmin.greet());      // Hello, I'm Alice       (userMethods)
console.log(aliceAdmin.isAdult());    // true                   (userMethods)

function User(name, age) {
  // new tự động:
  // 1. Tạo object rỗng {}
  // 2. Gán this = object rỗng đó
  // 3. Link prototype: this.[[Prototype]] = User.prototype
  // 4. Return this

  this.name = name; // Bạn chỉ cần gán data
  this.age = age;
}

// Methods đặt trên User.prototype để dùng chung
User.prototype.greet = function () {
  return `Hello, I'm ${this.name}`;
};

User.prototype.isAdult = function () {
  return this.age >= 18;
};

const alice = new User("Alice", 30);
const bob = new User("Bob", 17);

console.log(alice.greet());              // Hello, I'm Alice
console.log(bob.isAdult());             // false
console.log(alice.greet === bob.greet); // true ✅ — dùng chung

class User {
  constructor(name, age) {
    this.name = name;
    this.age = age;
  }

  greet() {
    return `Hello, I'm ${this.name}`;
  }

  isAdult() {
    return this.age >= 18;
  }
}

const alice = new User("Alice", 30);
const bob = new User("Bob", 17);

console.log(alice.greet());              // Hello, I'm Alice
console.log(alice.greet === bob.greet); // true ✅ — vẫn dùng chung prototype

// Proof: class chỉ là syntactic sugar
console.log(typeof User); // "function" — vẫn là function!

class Timer {
  constructor() {
    this.seconds = 0;
  }

  // ❌ Vấn đề: regular function mất this
  startBroken() {
    setInterval(function () {
      this.seconds++; // this = undefined (strict mode) hoặc global!
      console.log(this.seconds);
    }, 1000);
  }

  // ✅ Giải pháp: arrow function giữ this từ context bên ngoài
  startFixed() {
    setInterval(() => {
      this.seconds++; // this = Timer instance ✅
      console.log(this.seconds);
    }, 1000);
  }
}

const timer = new Timer();
timer.startFixed(); // 1, 2, 3, 4, ...

class ShoppingCart {
  constructor(discount) {
    this.prices = [100, 200, 300];
    this.discount = discount;
  }

  // ✅ Arrow function giữ this trong map
  getDiscounted() {
    return this.prices.map((price) => price * (1 - this.discount));
  }

  // ❌ Regular function mất this
  getDiscountedBroken() {
    return this.prices.map(function (price) {
      return price * (1 - this.discount); // this.discount = undefined!
    });
  }
}

const cart = new ShoppingCart(0.1);
console.log(cart.getDiscounted()); // [90, 180, 270] ✅

class UserProfile {
  // Instance fields — set mặc định trước constructor
  isActive = true;
  loginCount = 0;
  preferences = {
    theme: "light",
    language: "vi",
  };

  constructor(name, email) {
    this.name = name;
    this.email = email;
    // isActive, loginCount, preferences đã có sẵn rồi
  }

  login() {
    this.loginCount++;
    return `${this.name} đã đăng nhập lần thứ ${this.loginCount}`;
  }
}

const alice = new UserProfile("Alice", "alice@example.com");
const bob = new UserProfile("Bob", "bob@example.com");

alice.login();
alice.login();

console.log(alice.loginCount);  // 2
console.log(bob.loginCount);    // 0 — độc lập với alice

// Mỗi instance có preferences object riêng
alice.preferences.theme = "dark";
console.log(bob.preferences.theme); // "light" — không bị ảnh hưởng

class Config {
  static version = "2.1.0";
  static maxUsers = 1000;
  static appName = "MyApp";

  constructor(userRole) {
    this.userRole = userRole;
  }

  getInfo() {
    return `${Config.appName} v${Config.version} — Role: ${this.userRole}`;
  }
}

const admin = new Config("admin");
const guest = new Config("guest");

console.log(Config.version);    // "2.1.0"   — truy cập qua class
console.log(Config.maxUsers);   // 1000
console.log(admin.getInfo());   // MyApp v2.1.0 — Role: admin
console.log(guest.getInfo());   // MyApp v2.1.0 — Role: guest

// Static field không có trên instance
console.log(admin.version);     // undefined ❌

class BankAccount {
  #balance = 0;        // Private — bên ngoài không thể đọc/ghi trực tiếp
  #owner;              // Private

  constructor(owner, initialBalance) {
    this.#owner = owner;
    this.#balance = initialBalance;
  }

  deposit(amount) {
    if (amount <= 0) throw new Error("Số tiền phải lớn hơn 0");
    this.#balance += amount;
    return this;  // Cho phép chaining
  }

  withdraw(amount) {
    if (amount > this.#balance) throw new Error("Số dư không đủ");
    this.#balance -= amount;
    return this;
  }

  // Getter — đọc balance một cách có kiểm soát
  get balance() {
    return this.#balance;
  }

  getStatement() {
    return `Tài khoản của ${this.#owner}: ${this.#balance.toLocaleString()}đ`;
  }
}

const account = new BankAccount("Alice", 1000000);

account.deposit(500000).withdraw(200000); // Chaining
console.log(account.balance);            // 1300000
console.log(account.getStatement());     // Tài khoản của Alice: 1.300.000đ

// Cố tình truy cập private field — lỗi ngay!
console.log(account.#balance); // SyntaxError: Private field '#balance' must be declared

class UserRegistry {
  static #count = 0;             // Đếm số user đã tạo — private và shared
  static #instances = new Map(); // Lưu trữ tất cả instances

  #id;
  name;

  constructor(name) {
    UserRegistry.#count++;
    this.#id = UserRegistry.#count;
    this.name = name;
    UserRegistry.#instances.set(this.#id, this);
  }

  static getTotalUsers() {
    return UserRegistry.#count;
  }

  static findById(id) {
    return UserRegistry.#instances.get(id) || null;
  }

  toString() {
    return `User #${this.#id}: ${this.name}`;
  }
}

const alice = new UserRegistry("Alice");
const bob = new UserRegistry("Bob");
const charlie = new UserRegistry("Charlie");

console.log(UserRegistry.getTotalUsers()); // 3
console.log(UserRegistry.findById(2));     // User object của Bob
console.log(`${UserRegistry.findById(1)}`); // "User #1: Alice"

// Không thể truy cập trực tiếp
console.log(UserRegistry.#count); // SyntaxError ❌

class Counter {
  #count = 0; // Trạng thái nội bộ — bên ngoài không thể ghi trực tiếp

  increment() { this.#count++; }
  decrement() { if (this.#count > 0) this.#count--; }
  reset()     { this.#count = 0; }

  get value() { return this.#count; }
}

const counter = new Counter();
counter.increment();
counter.increment();
counter.decrement();

console.log(counter.value);   // 1

// ❌ Cố tình truy cập private field — SyntaxError ngay khi parse, không chạy được
counter.#count = 999;

class VideoPlayer {
  #currentTime = 0;
  #isPlaying = false;
  #volume = 0.8;
  #src;

  constructor(src) {
    this.#src = src;
    this.#loadMedia(); // Chi tiết load ẩn bên trong
  }

  // Chi tiết kỹ thuật — người dùng không cần biết
  #loadMedia() {
    console.log(`Loading: ${this.#src}...`);
    // decode, buffer, prepare stream, v.v.
  }

  #applyVolume() {
    // normalize, equalizer, DSP processing...
    console.log(`Volume set to ${this.#volume}`);
  }

  // Interface đơn giản để người dùng tương tác
  play() {
    if (this.#isPlaying) return;
    this.#isPlaying = true;
    console.log("Playing...");
  }

  pause() {
    this.#isPlaying = false;
    console.log("Paused.");
  }

  setVolume(level) {
    if (level < 0 || level > 1) throw new Error("Volume phải từ 0 đến 1");
    this.#volume = level;
    this.#applyVolume(); // Gọi logic phức tạp bên trong
  }

  get status() {
    return {
      playing: this.#isPlaying,
      volume: this.#volume,
      time: this.#currentTime,
    };
  }
}

const player = new VideoPlayer("movie.mp4");
player.play();
player.setVolume(0.5);
console.log(player.status); // { playing: true, volume: 0.5, time: 0 }

// Người dùng không thể (và không cần) gọi #loadMedia, #applyVolume

class Animal {
  constructor(name, sound) {
    this.name = name;
    this.sound = sound;
  }

  speak() {
    return `${this.name}: ${this.sound}!`;
  }

  eat(food) {
    return `${this.name} đang ăn ${food}`;
  }

  toString() {
    return `[Animal: ${this.name}]`;
  }
}

class Dog extends Animal {
  constructor(name, breed) {
    super(name, "Gâu gâu"); // Gọi constructor của Animal
    this.breed = breed;
  }

  fetch(item) {
    return `${this.name} đã lấy ${item} về!`;
  }

  // Override method của Animal
  toString() {
    return `[Dog: ${this.name} (${this.breed})]`;
  }
}

class Cat extends Animal {
  constructor(name, isIndoor) {
    super(name, "Meo meo");
    this.isIndoor = isIndoor;
  }

  purr() {
    return `${this.name}: Rrrr...`;
  }
}

const rex = new Dog("Rex", "Labrador");
const mimi = new Cat("Mimi", true);

console.log(rex.speak());        // Rex: Gâu gâu!  (từ Animal)
console.log(rex.fetch("bóng"));  // Rex đã lấy bóng về!  (của Dog)
console.log(rex.eat("xương"));   // Rex đang ăn xương  (từ Animal)
console.log(`${rex}`);           // [Dog: Rex (Labrador)]  (override)

console.log(mimi.speak());       // Mimi: Meo meo!
console.log(mimi.purr());        // Mimi: Rrrr...

// Kiểm tra quan hệ kế thừa
console.log(rex instanceof Dog);    // true
console.log(rex instanceof Animal); // true ✅ — Dog là Animal

class User {
  constructor(name, age) {
    this.name = name;
    this.age = age;
  }

  greet() {
    return `Hello, I'm ${this.name}`;
  }

  isAdult() {
    return this.age >= 18;
  }
}

class AdminUser extends User {
  constructor(name, age, permissions) {
    super(name, age); // Phải gọi trước
    this.permissions = permissions;
  }

  greet() {
    const base = super.greet(); // Lấy kết quả từ User.greet()
    return `${base} [ADMIN]`;
  }
}

const admin = new AdminUser("Alice", 30, ["read", "write", "delete"]);
console.log(admin.greet()); // Hello, I'm Alice [ADMIN]

class Shape {
  constructor(color) {
    this.color = color;
  }

  area() {
    // Class cha định nghĩa interface, subclass phải override
    throw new Error(`${this.constructor.name} phải implement area()`);
  }

  describe() {
    return `${this.constructor.name} màu ${this.color}, diện tích: ${this.area().toFixed(2)}`;
  }
}

class Circle extends Shape {
  constructor(color, radius) {
    super(color);
    this.radius = radius;
  }

  area() {
    return Math.PI * this.radius ** 2; // Override
  }
}

class Rectangle extends Shape {
  constructor(color, width, height) {
    super(color);
    this.width = width;
    this.height = height;
  }

  area() {
    return this.width * this.height; // Override
  }
}

class Triangle extends Shape {
  constructor(color, base, height) {
    super(color);
    this.base = base;
    this.height = height;
  }

  area() {
    return (this.base * this.height) / 2; // Override
  }
}

const shapes = [
  new Circle("đỏ", 5),
  new Rectangle("xanh", 4, 6),
  new Triangle("vàng", 3, 8),
];

// Polymorphism: gọi cùng method area() trên các loại object khác nhau
shapes.forEach((shape) => {
  console.log(shape.describe());
});
// Circle màu đỏ, diện tích: 78.54
// Rectangle màu xanh, diện tích: 24.00
// Triangle màu vàng, diện tích: 12.00

// Hàm tổng diện tích — không cần biết từng shape là loại gì
function totalArea(shapes) {
  return shapes.reduce((sum, shape) => sum + shape.area(), 0);
}

console.log(totalArea(shapes).toFixed(2)); // 114.54