как вернуть значения из асинхронных callback функций в javascript

Аватар пользователя Ivan Gagarinov
Ivan Gagarinov
27 ноября 2024

В классическом подходе значение возвращается через саму callback-функцию. Это делается путем передачи функции обратного вызова как параметра:

function asyncOperation(callback) {
    setTimeout(() => {
        const result = "Hello, World!";
        callback(result); // Возвращаем результат через callback
    }, 1000);
}

asyncOperation((result) => {
    console.log(result); // Здесь мы получаем результат
});

С введением Promises в ECMAScript 6 (ES6) управление асинхронным кодом стало более удобным. Promise позволяет вам вернуть значения более напрямую:

function asyncOperation() {
    return new Promise((resolve, reject) => {
        setTimeout(() => {
            const result = "Hello, World!";
            resolve(result); // Возвращаем результат через resolve
        }, 1000);
    });
}

asyncOperation()
    .then(result => {
        console.log(result); // Здесь мы получаем результат
    })
    .catch(error => {
        console.error(error); // Обработка ошибок
    });

Синтаксис async/await, введенный в ES2017, делает работу с асинхронным кодом еще более удобной, позволяя писать код, который выглядит синхронным. Но это так же будет работать только с промисами:

async function asyncOperation() {
    return new Promise((resolve) => {
        setTimeout(() => {
            resolve("Hello, World!"); // Возвращаем результат через resolve
        }, 1000);
    });
}

async function main() {
    try {
        const result = await asyncOperation(); // Ждем выполнения операции
        console.log(result); // Здесь мы получаем результат
    } catch (error) {
        console.error(error); // Обработка ошибок
    }
}

main();
1 0
Познакомьтесь с основами JavaScript бесплатно