我已经使用 d3.js v4 一段时间了,我了解到 Mike Bostock 已将 v5 版本中的 d3.queue 替换为 Promise 原生 JavaScript 对象。我想与您核实一下我编写的这段代码是否正确地(异步)这些 URL 排队:
var makeRequest = function() {
"use strict";
var bli = [
"http://stats.oecd.org/sdmx-json/data/BLI2013/all/all",
"http://stats.oecd.org/sdmx-json/data/BLI2014/all/all",
"http://stats.oecd.org/sdmx-json/data/BLI2015/all/all",
"http://stats.oecd.org/sdmx-json/data/BLI2016/all/all",
"http://stats.oecd.org/sdmx-json/data/BLI/all/all"
];
var promises = [];
bli.forEach(function(url) {
promises.push(
new Promise(function(resolve, reject) {
d3
.json(url)
.then(function(response) {
resolve(response);
})
.catch(function(error) {
console.log("Error on: " + url + ". Error: " + error);
reject(error);
});
})
);
});
Promise.all(promises).then(function(values) {
console.log(values);
});
};
makeRequest();
该代码似乎运行正常,但是,这是正确的代码还是有更好的方法(最佳实践方法)使用 Promise.all 和 d3.js 进行排队?捕获错误是否正确实现?
您可以大大简化该代码:您不需要使用网络new Promise
with d3.json
, since d3.json
本身就会创造承诺。
所以,你可以这样做:
var files = ["data1.json", "data2.json", "data3.json"];
var promises = [];
files.forEach(function(url) {
promises.push(d3.json(url))
});
Promise.all(promises).then(function(values) {
console.log(values)
});
或者,如果您热衷于代码高尔夫 https://en.wikipedia.org/wiki/Code_golf,甚至更短:
var files = ["data1.json", "data2.json", "data3.json"];
Promise.all(files.map(url => d3.json(url))).then(function(values) {
console.log(values)
});
由于我无法在 S.O. 中使用 JSON 文件。片段,检查此 bl.ocks 中的控制台:https://bl.ocks.org/GerardoFurtado/f08993c9c729b0b3452ef1803ad9dcbf/c4b45c5acce6033085a667cbb7d34203d15de0f0 https://bl.ocks.org/GerardoFurtado/f08993c9c729b0b3452ef1803ad9dcbf/c4b45c5acce6033085a667cbb7d34203d15de0f0
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)