并行运行两个函数，然后在 javascript 中使用 prev 函数的结果调用另一个函数答案

【问题标题】：Running two functions in parallel and then calling another function with result of prev functions in javascript并行运行两个函数，然后在 javascript 中使用 prev 函数的结果调用另一个函数
【发布时间】：2020-09-27 02:31:33
【问题描述】：

我的 javascript 代码..

function testdata(){
    var strtest_data='';
    var strtest1_data='';
    d3.json("js/test.json").then(function(test_json) {
        strtest_data=JSON.stringify(test_json);
       console.log(strtest_data); 
    })
    d3.json("js/test.json").then(function(test_json1) {
        strtest1_data=JSON.stringify(test_json1);
       console.log(strtest_data1); 
    })
     console.log(strtest_data); 
     var testobj=JSON.parse(strtest_data);
     var testobj1=JSON.parse(strtest_data1);
   
   console.log(JSON.stringify({data:testobj.quiz, more:testobj1.maths}));
}

在上面的代码中，我使用 d3.json 调用了两个函数（为了简洁起见，我正在调用相同的 test.json），然后调用另一个函数的结果。这里的函数是 console.log 但在实际场景中可能是使用 fetch 的 ajax POST 调用。

上述代码不起作用，因为代码的底部在 d3.json 完成之前运行..

我真诚地感谢任何帮助解决这个问题。

谢谢

【问题讨论】：

我建议 promise.all 用于您的 ajax 调用，然后您可以同时获得这两个结果。

标签： javascript

【解决方案1】：

d3.json是异步方法，所以如果要顺序调用，使用async/await

async function testdata() {
  let strtest_data = ""
  let strtest1_data = ""

  const test_json = await d3.json("js/test.json")
  strtest_data = JSON.stringify(test_json)
  console.log(strtest_data)

  const test_json1 = await d3.json("js/test.json")
  strtest1_data = JSON.stringify(test_json1)
  console.log(strtest_data1)

  var testobj = JSON.parse(strtest_data)
  var testobj1 = JSON.parse(strtest_data1)

  console.log(JSON.stringify({ data: testobj.quiz, more: testobj1.maths }))
}

或使用Promise.all同时调用它

async function testdata() {
  let strtest_data = ""
  let strtest1_data = ""

  const [test_json, test_json1] = await Promise.all([
    d3.json("js/test.json"),
    d3.json("js/test.json"),
  ])
  strtest_data = JSON.stringify(test_json)
  strtest1_data = JSON.stringify(test_json1)
  console.log(strtest_data)
  console.log(strtest_data1)

  var testobj = JSON.parse(strtest_data)
  var testobj1 = JSON.parse(strtest_data1)

  console.log(JSON.stringify({ data: testobj.quiz, more: testobj1.maths }))
}

【讨论】：

谢谢，只是想了解一下...，您在这里使用了 const。如果我使用 var 而不是使用 Stringify 和 Parse，我应该能够在最终的 console.log 中使用 test_json.quiz 和 test_json1.maths。这样做可以还是使用 var 不正确是这种情况..
@Arnab 使用 var 在这种情况下仍然可以。我只是使用 let/const 作为我自己的练习

【解决方案2】：

我认为

 Promise.all([    d3.json("js/test.json")
    d3.json("js/test.json")].then(data =>{
//call your other function and access using data array and make your call 
}).catch(e=>console.error("error ",e));

此函数将在完成后执行这两个调用，然后将结果放入数据数组中。如果任何一个调用中出现任何错误，您将在 catch 块中找到它。如果所有调用都成功完成，你可以在 then 块中做任何你想做的事情。

【讨论】：