Запропонувати правку

Покращити цю статтю

Допрацюйте відповідь до «Як додати метод у класі?». Ваші зміни проходять модерацію перед публікацією.

Потрібне підтвердження

Контент

Що ви змінюєте

Заголовок (UA)

Коротка відповідь (UA)

Показується над повною відповіддю для швидкого нагадування.

Відповідь (UA)

## 1. Звичайний (публічний) метод

Метод, доступний у всіх екземплярів класу:

```javascript
class User {
  constructor(name) {
    this.name = name;
  }

greet() {
    console.log(`Hi, ${this.name}!`);
  }
}

const u = new User("Alice");
u.greet(); // Hi, Alice!
```

Такі методи автоматично додаються в `User.prototype`,
тобто **розділяються між усіма екземплярами** (а не створюються заново для кожного об'єкта).

---

## 2. Додавання методу **після оголошення класу**

Ти можеш додати метод у прототип класу вже після його оголошення, вручну:

```javascript
class User {
  constructor(name) {
    this.name = name;
  }
}

// Додаємо метод пізніше
User.prototype.sayBye = function () {
  console.log(`${this.name} каже: бувай!`);
};

const u = new User("Alice");
u.sayBye(); // Alice каже: бувай!
```

Це працює, бо під капотом `class`, це просто функція з `prototype`.

---

## 3. Статичний метод (`static`)

Такий метод викликається **безпосередньо у класу**, а не в екземпляра:

```javascript
class MathUtils {
  static square(n) {
    return n * n;
  }
}

console.log(MathUtils.square(5)); // 25
```

> Екземпляри (`new MathUtils()`) не мають доступу до `static`-методів.

---

## 4. Геттер і сеттер

Використовуються, щоб "маскувати" властивості під методи:

```javascript
class Product {
  constructor(price) {
    this._price = price;
  }

get price() {
    return this._price + " $";
  }

set price(value) {
    if (value < 0) throw new Error("Ціна не може бути від'ємною");
    this._price = value;
  }
}

const p = new Product(1000);
console.log(p.price); // "1000 $"

p.price = 1500;
console.log(p.price); // "1500 $"
```

> Під час доступу `p.price` фактично викликається `get price()`,
> під час присвоєння `p.price = ...`, викликається `set price()`.

---

## 5. Приватні методи (`#methodName`)

Недоступні ззовні, лише всередині класу:

```javascript
class Account {
  #logBalance() {
    console.log(`Поточний баланс: ${this.balance}`);
  }

constructor(balance) {
    this.balance = balance;
    this.#logBalance(); // можна викликати лише звідси
  }
}

const acc = new Account(500);
// acc.#logBalance(); Помилка: приватний метод
```

---

## 6. Методи-поля (стрілкові функції)

Якщо хочеш, щоб метод **зберігав контекст** `this`, можна оголосити його як поле:

```javascript
class Button {
  label = "Click me";

handleClick = () => {
    console.log(`Clicked: ${this.label}`);
  };
}

const b = new Button();
b.handleClick(); // Clicked: Click me
```

Такі методи не втрачають `this`, навіть якщо передати їх як колбек:

```javascript
setTimeout(b.handleClick, 1000); // все працює коректно
```

---

## Підсумок

| Тип методу | Синтаксис | Доступність | Особливості |
| --- | --- | --- | --- |
| Звичайний | `method() {}` | Через екземпляр | Спільний для всіх екземплярів |
| Статичний | `static method() {}` | Через сам клас | Не видно в екземплярів |
| Геттер / сеттер | `get name() {}`, `set name(v) {}` | Як властивість | Можна контролювати доступ |
| Приватний | `#method() {}` | Лише всередині класу | Повна інкапсуляція |
| Поле-метод (стрілка) | `method = () => {}` | Через екземпляр | Не втрачає `this` |

Markdown · перетягуйте зображення · ⌘B / ⌘I шорткати460 слів

Для рев’юера

Примітка для модератора (необов’язково)

Бачить лише модератор. Прискорює рев’ю.