javascript - Promises 中的异步函数

标签 javascript promise es6-promise

这是我的情况:

fetchData(foo).then(result => {
    return new Promise((resolve, reject) => {
        setTimeout(() => {
            resolve(result + bar);
        }, 0)
    });
}).then(result => {
    return new Promise((resolve, reject) => {
        setTimeout(() => {
            resolve( result + woo);
        }, 0)
    });
}).then(result => {
    setTimeout(() => {
        doSomething(result);
    }, 0)
});

其中每个 setTimeout 都是使用回调模式的不同异步操作。

将每个函数都包装在一个 promise 中真的很痛苦,我觉得代码应该看起来更像这样:

fetchData(foo).then(result => {
    setTimeout(() => {
        return result + bar;
    }, 0)
}).then(result => {
    setTimeout(() => {
        return result + woo;
    }, 0)
}).then(result => {
    setTimeout(() => {
        doSomething(result);
    }, 0)
});

显然这行不通。

我是否正确使用了 Promises?我真的必须将所有现有的异步函数包装在 promises 中吗?

编辑:

实际上,我意识到我的例子并不能完全代表我的情况,我没有明确表示我的例子中的 setTimeout 是为了代表异步操作。这种情况更能代表我的情况:

fetchData(foo).then(result => {
    return new Promise((resolve, reject) => {
        asyncOperation(result, operationResult => {
            resolve(operationResult);
        }, 0)
    });
}).then(result => {
    return new Promise((resolve, reject) => {
        otherAsyncOperation(result, otherAsyncResult => {
            resolve( otherAsyncResult);
        }, 0)
    });
}).then(result => {
        doSomething(result);
});

最佳答案

Am I using Promises right? Do I really have to wrap all existing async function in promises?

是的。是的。

I feel like the code should look more like this

不,不应该。它应该看起来像这样:

function promiseOperation(result) {
    return new Promise((resolve, reject) => {
        asyncOperation(result, resolve, 0)
    });
}
function otherPromiseOperation(result) {
    return new Promise((resolve, reject) => {
        otherAsyncOperation(result, resolve, 0)
    });
}

fetchData(foo).then(promiseOperation).then(otherPromiseOperation).then(doSomething);

It is really painfull to wrap each function inside a promise

嗯,不要每次都重复写出来。您可以将此包装抽象为一个函数!

function promisify(fn) {
    return value => new Promise(resolve => {
        fn(value, resolve, 0)
    });
}
const promiseOperation = promisify(asyncOperation);
const otherPromiseOperation = promisify(otherAsyncOperation);
fetchData(foo).then(promiseOperation).then(otherPromiseOperation).then(doSomething);

请注意,大多数 promise 库都包含这样的 promisification 函数,因此您的整个代码减少到这三行。

关于javascript - Promises 中的异步函数,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42828856/

相关文章:

javascript - 使用 promise /构造 promise 链时,如何设计/集成错误处理?

Angularjs $http.get().then 并绑定(bind)到列表

javascript - 坚决 promise 并拒绝作为属性(property),这是一种反模式吗?为什么?

javascript - 如何使点击时的下拉菜单不悬停

javascript - PythonAnywhere 如何处理多个 "web workers"或进程

javascript - 无法覆盖 Promise 类上的方法 - Promise.prototype.then 在不兼容的接收器上调用未定义

javascript - 异步代码执行解释

javascript - 如何在 angular-bootstrap-datetimepicker 输入字段中显示自定义日期格式?

Javascript - 如何在视频结束时更改 iframe 的 src

javascript - 处理 promise 错误的最佳方法是什么?