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

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

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

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

Контент

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

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

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

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

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

## 1) Function declaration (оголошення функції)

```javascript
function sum(a, b) {
  return a + b;
}
```

- **hoisting** (можна викликати до оголошення).
- Має власний `this` при виклику як методу/функції.
- Можна використовувати як конструктор (`new sum()`).

---

## 2) Function expression (функціональний вираз)

```javascript
const mul = function(a, b) {
  return a * b;
};
```

- **Немає hoisting** (доступна після присвоєння).
- Може бути анонімною або іменованою:

```javascript
const fact = function factorial(n) { /* ... */ }; // іменована - ім'я доступне всередині функції
```

---

## 3) Arrow function (стрілкові функції)

```javascript
const inc = x => x + 1;
const sum = (a, b) => a + b;
```

- **Лексичний** `this` - `this` береться із зовнішнього лексичного оточення.
- **Немає** `arguments` (можна використовувати rest `...args`).
- **Не можна** використовувати як конструктор (`new`), немає `prototype`.
- Чудово підходять для колбеків і коротких функцій.

---

## 4) Function constructor

```javascript
const fn = new Function('a', 'b', 'return a + b');
```

- Створює функцію з рядка (як `eval`).
- **Не рекомендується**: проблеми з безпекою та продуктивністю.

---

## 5) Generator function (`function*`)

```javascript
function* idGenerator() {
  let i = 0;
  while (true) {
    yield i++;
  }
}
```

- Повертає ітератор; підтримує `yield`.
- Можна призупиняти/відновлювати виконання.

---

## 6) Async function

```javascript
async function fetchData() {
  const r = await fetch('/api');
  return r.json();
}

const fn = async () => { /* теж можливо */ };
```

- Повертає `Promise`.
- Можна використовувати `await` всередині.

---

## 7) Method definitions в об'єктах (shorthand)

```javascript
const obj = {
  sayHi() { console.log('hi'); }, // метод
  async load() { await fetch('/'); } // async-метод
};
```

- Зручно для методів; у них є `[[HomeObject]]` - підтримка `super`.
- Можна також писати як `prop: function() {}` - це звичайний функціональний вираз.

---

## 8) Class methods (всередині `class`)

```javascript
class C {
  method() {}
  static staticMethod() {}
  async asyncMethod() {}
}
```

- Методи класу - немає hoisting, використовуються з екземплярами/класом, підтримують `super`.

---

## 9) IIFE - Immediately Invoked Function Expression

```javascript
(function() {
  // виконується негайно
})();
```

- Корисно для локальної області видимості (раніше - до модулів).

---

## 10) Function.prototype.bind (створення зв'язаної функції)

```javascript
function f() { console.log(this); }
const bound = f.bind({x:1});
```

- Повертає нову функцію із зафіксованим `this` та/або частково застосованими аргументами.

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

Для рев’юера

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

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