[英]Promise.all not working as expected
我在使用 Promise 编写异步 function 时遇到问题
function requestsPlot(plot, info) {
return new Promise(function(resolve, reject) {
var plotObject = fieldsObject[plot]
var sqr = new Promise(function(resolve1, reject) {
debugger;
get(createSQRurl(plotObject.polygon))
.then(function(result) {
plotObject.quality = sqrHtmlParsing(result);
resolve1();
});
});
var soilType = new Promise(function(resolve2, reject) {
get(createSoilTypeUrl(plotObject.polygon))
.then(function(result) {
plotObject.soilType = soilTypeHtmlParsing(result);
resolve2();
});
});
var distance = new Promise(function(resolve3, reject) {
var start = turf.centerOfMass(plotObject.polygon).geometry.coordinates;
var end = info.homeCoords;
get('http://router.project-osrm.org/route/v1/driving/' + start + ';' + end + '?overview=false')
.then(function(result) {
var parsed = JSON.parse(result);
if (parsed.code == 'Ok') {
plotObject.distance = parsed.routes[0].distance / 1000;
resolve3()
} else {
plotObject.distance = '';
resolve3()
}
});
});
Promise.all([sqr, soilType, distance]).then(function() {
resolve('test');
})
})
}
这个想法是解决由 requestPlot function 返回的 promise 在 function (变量 sqr、soilType 和距离)内的所有承诺之后。 但是,promise 已解决,而 get function 中的所有请求仍处于待处理状态。 请注意,“获取”function 还返回 promise。 非常感谢你的帮助!
PS这里是得到function
function get(url) {
var requestPromise = new Promise(function(resolve, reject) {
var req = new XMLHttpRequest();
req.open('get', url);
req.onload = function() {
if (req.status == 200) {
resolve(req.response);
}
else {
reject(Error(req.statusText));
}
};
req.onerror = function() {
reject(Error("Network Error"));
};
req.send();
});
return requestPromise
}
在承诺中嵌套承诺是一种众所周知的反模式 。
您不需要任何这些承诺构造函数,因为您已经get
了返回承诺的get
,您可以直接使用它。
以下是重写代码的方法:
function requestsPlot(plot, info) {
const sqr = get(createSQRurl(plotObject.polygon))
.then(sqrHtmlParsing);
const soilType = get(createSoilTypeUrl(plotObject.polygon))
.then(soilTypeHtmlParsing);
const start = turf.centerOfMass(plotObject.polygon).geometry.coordinates;
const end = info.homeCoords;
const distance = get('http://router.project-osrm.org/route/v1/driving/' + start + ';' + end + '?overview=false')
.then(JSON.parse);
return Promise.all([sqr, soilType, distance])
.then(([parsedSqr, parsedSoilType, parsedDistance]) =>
Object.assign(plotObject, {
quality: parsedSqr,
soilType: parsedSoilType,
distance: parsedDistance.code == 'Ok'
? parsed.routes[0].distance / 1000
: ''
}))
}
在具有 async/await 语法的现代 javascript 中,promise.all 语法应如下所示
await promise.all([asyncfuntion1(),asyncfunction2(),...])
不要忘记在 promise 列表中调用您的异步函数 -> asyncfunction1() 而不仅仅是 asyncfuntion1
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.