Suggest an edit

Improve this article

Refine the answer for “wrapper function”. Your changes go to moderation before they’re published.

Approval required

Content

What you’re changing

Title (EN)

Short answer (EN)

Shown above the full answer for quick recall.

Answer (EN)

A **wrapper function** is a function that **wraps another function or piece of code** to **add extra behavior**, **control**, or **simplify the call**.

In simpler terms:

> A wrapper function is a "layer" around another function that **breaks nothing**, but **adds something**: logging, validation, error handling, caching, and so on.

---

## Main idea

You take an existing function (or operation)
and create a new one that calls it **inside itself**, but with something "on top".

For example:

- add **logging** before the call;
- measure the **execution time**;
- add **argument validation**;
- or, for example, **handle errors via try/catch**.

---

## Example 1 - a simple wrapper with logging

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

const loggedGreet = withLogging(greet);
loggedGreet('Tim');
```

Output:

```javascript
Calling function greet with arguments: [ 'Tim' ]
Result: Hello, Tim!
```

Here `withLogging` is a **wrapper function** that adds extra behavior "on top" of the regular `greet` function.

---

## Example 2 - a wrapper for error handling

```javascript
function riskyOperation() {
  throw new Error('Something went wrong!');
}

const safeOp = safeWrapper(riskyOperation);
safeOp(); // Error calling the function: Something went wrong!
```

Now even if the inner function throws, the code does not break.

---

## Example 3 - measuring execution time

```javascript
function heavyTask() {
  for (let i = 0; i < 1e7; i++) {}
}

const measuredTask = measureTime(heavyTask);
measuredTask(); // Execution time: 12.34ms
```

---

## Example 4 - a wrapper function in async code

```javascript
async function fetchData() {
  const res = await fetch('https://api.example.com/data');
  return res.json();
}

const safeFetch = withErrorHandling(fetchData);
safeFetch();
```

This is already an **async wrapper** that automatically catches errors.

---

## Example 5 - a wrapper for "decorators" (a similar pattern)

```javascript
function authWrapper(fn) {
  return function(user, ...args) {
    if (!user.isAdmin) {
      throw new Error('Access denied');
    }
    return fn(user, ...args);
  };
}

function deletePost(user, postId) {
  console.log(`Post ${postId} deleted`);
}

const deletePostWithAuth = authWrapper(deletePost);

deletePostWithAuth({ isAdmin: true }, 42); // Post 42 deleted
deletePostWithAuth({ isAdmin: false }, 42); // Error: Access denied
```

---

## Why wrapper functions are useful

| Goal | Example |
|---|---|
| **Extending functionality** | Add logging, metrics, caching |
| **Security** | Check access rights or a token |
| **Error handling** | Wrap risky operations in try/catch |
| **Reuse** | Create a "behavior" template for many functions |
| **Functional programming** | Use higher-order functions |

---

## Summary

| Property | Description |
|---|---|
| What it is | A function that calls another one inside itself |
| Goal | Add or change behavior without changing the original |
| Type | Higher-order function |
| Typical examples | Logging, cache, validation, try/catch, metrics |
| Pros | Reusable, safe, readable |

Markdown · drag & drop images · ⌘B / ⌘I shortcuts550 words

For the reviewer

Note to the moderator (optional)

Visible only to the moderator. Helps review go faster.