我的问题与 this 非常相似,但我无法让它工作:(
问题:
我有一个 Javascript 程序需要在 IE11 和 Chrome 中运行。
它有一个我需要按顺序执行的函数列表。
每个函数都会返回一个 Promise。
Promise.all(promisesArray)
工作到我可以“等待”直到所有功能完成后再继续。但它不能保证每个函数都按顺序运行。这是至关重要的。我尝试过使用
Array.prototype.reduce()
,但我一直不知道如何正确使用它。因为我需要在 IE11 中运行,所以无法使用“箭头函数”等 ES6 功能。
这是我的代码:
<script>
var fn = function(arg) {
return new Promise (function (resolve, reject) {
console.log("fn(" + arg + ")...");
resolve("OK");
});
}
var p = fn("A").then(function(r) {
console.log("promise resolved: " + r + ".");
})
var chain = [];
chain.push(fn("3"));
chain.push(fn("1"));
chain.push(fn("2"));
console.log("Built chain:", chain);
Promise.all(chain);
chain.length = 0;
chain[2] = fn("30");
chain[1] = fn("20");
chain[0] = fn("10");
chain.reduce(function(promise, item) {
return promise.then(function() {
console.log("then:", item);
}), Promise.resolve();
});
console.log("Done.");
</script>;
我需要按顺序执行函数array[0]、array[1]、array[2]
。
最佳答案
你的 reducer 真的很接近!
reducer 的初始值为 Promise.resolve()
,因此当第一次调用该函数时:
chain.reduce(function(promise, item) {
// ^^ promise is a resolved promise,
// ^^ item is chain[0]
return promise.then(function() {
console.log("then:", item);
// ^^ when the promise resolves (immediately) this is called
// BUT no value is returned.
}), Promise.resolve();
});
将此与手动链接 promise 进行比较。您将返回下一个要等待的 promise :
Promise.resolve()
.then(item => { console.log("then: ", item); return fn("10"); })
.then(item => { console.log("then: ", item); return fn("20"); })
.then(item => { console.log("then: ", item); return fn("30"); })
看看 reducer 怎么这么近?我们只想返回一个 promise :
var chain = [fn("10"), fn("20"), fn("30")];
chain.reduce(function(promise, item) {
return promise.then(function() {
console.log("then:", item);
return item;
}), Promise.resolve();
});
编辑:
如果 fn
调用开始工作,则每个分配都将不按顺序启动调用:
chain.length = 0;
chain[2] = fn("30");
chain[1] = fn("20");
chain[0] = fn("10");
要按照您想要的顺序运行每个 fn
,您必须将对 fn
的调用推迟到上一个调用解析为止。我们在上面的手动示例中做到了这一点。根据数据的复杂程度,您可以减少 fn
的参数数组,或者将每个调用包装在不会运行的函数中:
[10,20,30]
.reduce(function(promise, arg) {
return promise.then(function() {
return fn(arg);
}), Promise.resolve();
});
[function() { return fn(10); }, function() { return fn(20) }, function() { return fn(30) }]
.reduce(function(promise, callFn) {
return promise.then(function() {
return fn(callFn);
}), Promise.resolve();
});
关于javascript - 如何序列化返回 Promises 的 Javascript 函数数组?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/50263209/