Запропонувати правкуПокращити цю статтюДопрацюйте відповідь до «функція-обгортка». Ваші зміни проходять модерацію перед публікацією.Потрібне підтвердженняКонтентЩо ви змінюєте🇺🇸EN🇺🇦UAПереглядЗаголовок (UA)Коротка відповідь (UA)**Функція-обгортка (wrapper function)** - це функція, яка **обгортає іншу функцію або код**, щоб **додати додаткову поведінку**, **контроль** або **спростити виклик**. **Ключове:** функція-обгортка нічого не ламає в оригінальній функції, а лише додає щось поверх - логування, валідацію, обробку помилок, кешування тощо.Показується над повною відповіддю для швидкого нагадування.Відповідь (UA)Зображення**функція-обгортка (wrapper function)** - це функція, яка **обгортає іншу функцію або код**, щоб **додати додаткову поведінку**, **контроль** або **спростити виклик**. Простіше кажучи: > Функція-обгортка - це "прошарок" навколо іншої функції, яка **нічого не ламає**, але **щось додає**: логування, валідацію, обробку помилок, кешування тощо. --- ## Основна ідея Ти береш уже наявну функцію (або операцію) і створюєш нову, яка викликає її **всередині себе**, але з чимось "зверху". Наприклад: - додати **логування** перед викликом; - виміряти **час виконання**; - додати **перевірку аргументів**; - або, наприклад, **обробляти помилки через try/catch**. --- ## Приклад 1 - проста обгортка з логуванням ```javascript function greet(name) { return `Привіт, ${name}!`; } function withLogging(fn) { return function(...args) { console.log(`Виклик функції ${fn.name} з аргументами:`, args); const result = fn(...args); console.log(`Результат:`, result); return result; }; } const loggedGreet = withLogging(greet); loggedGreet('Tim'); ``` Вивід: ```javascript Виклик функції greet з аргументами: [ 'Tim' ] Результат: Привіт, Tim! ``` Тут `withLogging` - це **функція-обгортка**, яка додає "поверх" звичайної функції `greet` додаткову поведінку. --- ## Приклад 2 - обгортка для обробки помилок ```javascript function riskyOperation() { throw new Error('Щось пішло не так!'); } function safeWrapper(fn) { return function(...args) { try { return fn(...args); } catch (err) { console.error('Помилка при виклику функції:', err.message); return null; } }; } const safeOp = safeWrapper(riskyOperation); safeOp(); // Помилка при виклику функції: Щось пішло не так! ``` Тепер навіть якщо внутрішня функція падає - код не ламається. --- ## Приклад 3 - вимірювання часу виконання ```javascript function heavyTask() { for (let i = 0; i < 1e7; i++) {} } function measureTime(fn) { return function(...args) { const start = performance.now(); fn(...args); const end = performance.now(); console.log(`Час виконання: ${(end - start).toFixed(2)}ms`); }; } const measuredTask = measureTime(heavyTask); measuredTask(); // Час виконання: 12.34ms ``` --- ## Приклад 4 - функція-обгортка в асинхронному коді ```javascript async function fetchData() { const res = await fetch('https://api.example.com/data'); return res.json(); } function withErrorHandling(fn) { return async function(...args) { try { return await fn(...args); } catch (e) { console.error('Помилка при запиті:', e); return null; } }; } const safeFetch = withErrorHandling(fetchData); safeFetch(); ``` Це вже **асинхронна обгортка**, яка автоматично ловить помилки. --- ## Приклад 5 - обгортка для "декораторів" (схожий патерн) ```javascript function authWrapper(fn) { return function(user, ...args) { if (!user.isAdmin) { throw new Error('Доступ заборонено'); } return fn(user, ...args); }; } function deletePost(user, postId) { console.log(`Пост ${postId} видалено`); } const deletePostWithAuth = authWrapper(deletePost); deletePostWithAuth({ isAdmin: true }, 42); // Пост 42 видалено deletePostWithAuth({ isAdmin: false }, 42); // Помилка: Доступ заборонено ``` --- ## Навіщо потрібні функції-обгортки | Мета | Приклад | |---|---| | **Розширення функціоналу** | Додати логування, метрики, кешування | | **Безпека** | Перевірити права доступу або токен | | **Обробка помилок** | Обгорнути ризиковані операції в try/catch | | **Перевикористання** | Створити шаблон "поведінки" для багатьох функцій | | **Функціональне програмування** | Використовувати функції вищого порядку (higher-order functions) | --- ## Підсумок | Властивість | Опис | |---|---| | Що це | Функція, яка викликає іншу всередині себе | | Мета | Додати або змінити поведінку без зміни оригіналу | | Тип | Функція вищого порядку (higher-order function) | | Типові приклади | Логування, кеш, валідація, try/catch, метрики | | Плюси | Перевикористовується, безпечно, читабельно |Для рев’юераПримітка для модератора (необов’язково)Бачить лише модератор. Прискорює рев’ю.