JavaScript?? ???? ?????(OOP) ????

??: 2024? 12? 17?

?? ?? ?????(OOP)? ??? ???? ?? ???? ????? ???????. ??? ????? ??? JavaScript? ?????, ES6 ??? ? ?? ?? ??? ?? OOP? ?? ??? ??? ?????. ??? JavaScript?? OOP? ??? ??? ?? ??? ???????.

---

?????? OOP ?? ??

1. ??

??? OOP? ?? ?????. JavaScript?? ??? ?-? ?? ?????.

?: ?? ??

const car = {
  brand: "Toyota",
  model: "Corolla",
  start() {
    return `${this.brand} ${this.model} is starting.`;
  }
};

console.log(car.start()); // Output: Toyota Corolla is starting.

---

2. ??

???? ?? ??? ?? ??????. ???? ??? ??????. JavaScript? ES6?? class ???? ??????.

?: ??? ??

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

  makeSound() {
    return `${this.name} is making a sound.`;
  }
}

const dog = new Animal("Buddy", "Dog");
console.log(dog.makeSound()); // Output: Buddy is making a sound.

---

3. ???

???? ?? ?? ??? ?? ?? ???? ????? ???? ???? ?? ?? ?? ?????. JavaScript? ??, ??? ? ?? ??? ???? ?? ?????.

??? ??

??? ??? # ???? ???? ??? ???? ???? ? ????.

?: ??? ??

class BankAccount {
  #balance;

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

  deposit(amount) {
    this.#balance += amount;
  }

  getBalance() {
    return this.#balance;
  }
}

const account = new BankAccount(100);
account.deposit(50);
console.log(account.getBalance()); // Output: 150
// console.log(account.#balance); // Error: Private field '#balance' must be declared in an enclosing class

---

4. ??

??? ?? ? ???? ?? ???? ???? ?? ???? ??? ???? ???? ? ????.

?: ??

class Vehicle {
  constructor(brand) {
    this.brand = brand;
  }

  start() {
    return `${this.brand} vehicle is starting.`;
  }
}

class Car extends Vehicle {
  constructor(brand, model) {
    super(brand); // Calls the parent class constructor
    this.model = model;
  }

  display() {
    return `${this.brand} ${this.model} is ready to go.`;
  }
}

const myCar = new Car("Tesla", "Model S");
console.log(myCar.display()); // Output: Tesla Model S is ready to go.

---

5. ???

???? ???? ?? ???? ?? ???? ???? ????? ?? ??? ??? ? ????.

?: ??? ???

class Shape {
  area() {
    return "Area is not defined.";
  }
}

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

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

const circle = new Circle(5);
console.log(circle.area()); // Output: 78.53981633974483

---

6. ???

???? ?? ???? ???? ???? ?? ??? ???? ? ??? ???. JavaScript?? ????? ?? ???? ??? ?? ?????? ? ????.

?: ??? ?????

class Animal {
  constructor(name) {
    if (this.constructor === Animal) {
      throw new Error("Abstract class cannot be instantiated directly.");
    }
    this.name = name;
  }

  makeSound() {
    throw new Error("Abstract method must be implemented.");
  }
}

class Dog extends Animal {
  makeSound() {
    return "Bark!";
  }
}

const dog = new Dog("Buddy");
console.log(dog.makeSound()); // Output: Bark!
// const animal = new Animal("Some Animal"); // Error: Abstract class cannot be instantiated directly.

---

7. ?????? ????? ??

JavaScript? ????? ?? ?????. ?? ???? ???????? ?? ??? ?? ?? ??? ????.

?: ????? ??

const car = {
  brand: "Toyota",
  model: "Corolla",
  start() {
    return `${this.brand} ${this.model} is starting.`;
  }
};

console.log(car.start()); // Output: Toyota Corolla is starting.

---

8. ?? ??? ??

??? ???? ?? ??? ???? ??? ??? ? ????. ? ?? ??? ?? ?? ?? ??? ???? ?????.

?: ??

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

  makeSound() {
    return `${this.name} is making a sound.`;
  }
}

const dog = new Animal("Buddy", "Dog");
console.log(dog.makeSound()); // Output: Buddy is making a sound.

---

OOP? ?? ??

1. DRY(???? ???): ???? ??? ?? ??? ??????.
2. SOLID ??: ?? ???? ?? ??? ??? OOP ?? ??? ?? ?? ??? ????.

---

?? ??: ??? ?? ???

1??: ?? ??? ??

class BankAccount {
  #balance;

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

  deposit(amount) {
    this.#balance += amount;
  }

  getBalance() {
    return this.#balance;
  }
}

const account = new BankAccount(100);
account.deposit(50);
console.log(account.getBalance()); // Output: 150
// console.log(account.#balance); // Error: Private field '#balance' must be declared in an enclosing class

2??: ?? ??

class Vehicle {
  constructor(brand) {
    this.brand = brand;
  }

  start() {
    return `${this.brand} vehicle is starting.`;
  }
}

class Car extends Vehicle {
  constructor(brand, model) {
    super(brand); // Calls the parent class constructor
    this.model = model;
  }

  display() {
    return `${this.brand} ${this.model} is ready to go.`;
  }
}

const myCar = new Car("Tesla", "Model S");
console.log(myCar.display()); // Output: Tesla Model S is ready to go.

3??: ???? ??

class Shape {
  area() {
    return "Area is not defined.";
  }
}

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

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

const circle = new Circle(5);
console.log(circle.area()); // Output: 78.53981633974483

---

?? ??

1. ??? ?? ???? ?? ??? ?? ??? ????.
2. ??? ?? ???? ??? ?? ? ??? ?? ??? ???? ?? BankAccount ???? ?????.
3. ???? ???? Car ? Bike? ?? ?? ???? ???? Vehicle ???? ?????.

---

??

JavaScript? OOP? ???? ????? ??? ??? ??? ???? ??? ??? ?????. ???, ??, ???, ???? ?? ??? ???? ?? ??? ??????? ??? ? ?? ??? ??? ???. ??? ??? ?? ???? ?? ??? ???? ??? ??? ???!

?? ??: JavaScript? ??? ?????? ???? ??, Promise ? async/await? ?? ??? ???????. ?? ??????!

? ??? JavaScript?? ???? ?????(OOP) ????? ?? ?????. ??? ??? PHP ??? ????? ?? ?? ??? ?????!