TGViewer
Frontend | Вопросы собесов Frontend | Вопросы собесов @easy_javascript_ru · 17.6K subscribers
Post #255 9.54K
Какие способы работы с асинхронным кодом знаешь ?
Спросят с вероятностью 7%

Существует несколько способов работы с асинхронным кодом. Основные из них включают использование обратных вызовов (callbacks), промисов (Promises) и асинхронных функций (async/await). Рассмотрим каждый из них более подробно.

1️⃣Обратные вызовы (Callbacks)

Это функции, которые передаются как аргументы в другие функции и вызываются после завершения асинхронной операции.
function fetchData(callback) {
setTimeout(() => {
callback('Data received');
}, 1000);
}

fetchData((data) => {
console.log(data); // 'Data received'
});


2️⃣Промисы (Promises)

Предоставляют более элегантный способ работы с асинхронным кодом, избегая "ад колбэков" (callback hell). Промис может находиться в одном из трёх состояний: ожидание (pending), выполнен (fulfilled) или отклонён (rejected).
function fetchData() {
return new Promise((resolve, reject) => {
setTimeout(() => {
resolve('Data received');
}, 1000);
});
}

fetchData()
.then((data) => {
console.log(data); // 'Data received'
})
.catch((error) => {
console.error(error);
});


3️⃣Асинхронные функции (Async/Await)

Это синтаксическая надстройка над промисами, которая позволяет писать асинхронный код так, как будто он синхронный, что делает его более читабельным и удобным.
function fetchData() {
return new Promise((resolve, reject) => {
setTimeout(() => {
resolve('Data received');
}, 1000);
});
}

async function fetchAsyncData() {
try {
const data = await fetchData();
console.log(data); // 'Data received'
} catch (error) {
console.error(error);
}
}

fetchAsyncData();


4️⃣Асинхронные итераторы (Async Iterators) и генераторы (Generators)

Используются для обработки потоков данных асинхронно, что полезно, например, при чтении данных из сетевых запросов или файлов.
async function* asyncGenerator() {
let i = 0;
while (i < 3) {
yield new Promise((resolve) =>
setTimeout(() => resolve(i++), 1000)
);
}
}

(async () => {
for await (let value of asyncGenerator()) {
console.log(value); // 0, затем 1, затем 2 (с интервалом в 1 секунду)
}
})();


Почему это важно?

✅Управление асинхронностью: Все эти способы позволяют эффективно управлять асинхронными операциями, такими как сетевые запросы, таймеры и взаимодействие с базами данных.
✅Читаемость и поддерживаемость кода: Использование промисов и async/await делает код более читаемым и поддерживаемым по сравнению с колбэками, особенно в сложных сценариях.
✅Ошибки и обработка исключений: Промисы и async/await предоставляют удобные механизмы для обработки ошибок, что делает код более устойчивым и надёжным.

Основные способы работы с асинхронным кодом включают колбэки, промисы и async/await. Каждый из них предоставляет свои преимущества для управления асинхронными операциями, делая код более читабельным и удобным для поддержки.

👉 Можно посмотреть Примеры как отвечают люди на этот вопрос, или перейти К списку 1429 вопроса на Frontend разработчика. Ставь 👍 если нравится контент

🔐 База собесов | 🔐 База тестовых
  • 👍 36
  • ❤ 9
  • 🔥 8
More from @easy_javascript_ru
  1. Oct 17, 2026🤔 Какие значения будут являться falsy значениями? В JavaScript значения, которые при прив…
  2. Oct 16, 2026🤔 Что такое meta теги? Meta-теги – это специальные HTML-теги, которые содержат метаинформ…
  3. Oct 15, 2026🤔 Какие преимущества у di? Dependency Injection (DI) – это паттерн проектирования, которы…
  4. Oct 14, 2026🤔 Зачем создавались библиотеки react и другие? Библиотеки, такие как React, создавались д…
  5. Oct 13, 2026🤔 Что такое репозиторий? Это хранилище кода, файлов и их истории изменений. Используется…
  6. Oct 13, 2026🤔 Как мы можем замерить скорость работы участка кода с date.Now? В JavaScript можно замер…
Threads Profile ViewerView any public Threads profile without an account.Open ThreadLook →Writing with AI? Make it sound human.Metric37 rewrites AI drafts so they read naturally. Free AI detector, 1,500 words free.Try Metric37 →