javascript获取提取数据[重复]答案

【问题标题】：javascript fetch extract data [duplicate]javascript获取提取数据[重复]
【发布时间】：2021-11-21 07:40:47
【问题描述】：

我设置了这个获取结构（我在这里学习的：https://www.kirupa.com/html5/making_http_requests_js.htm），但我无法执行获取数据的功能：

var arr = [];
var dat=[1,2];
var prova = 5;
fetch('https://ipinfo.io')
  .then(function(response) {
    return response.text();
  }).then(function(text) {
  arr.push(text);
  dat = arr;
  prova=prova+1;
  //console.log(arr);
  });
console.log(arr);
console.log(dat);
console.log(prova);
//document.getElementById('pText').innerHTML = dat[0];

console.log(arr)  -> undefined
console.log(dat)  -> [1,2]
console.log(prova) -> 5

我将变量定义为全局并在函数中修改，但全局变量并没有按预期改变，你知道为什么吗？

提前感谢您的支持。

抱歉，我在另一个链接问题中没有找到我的问题的答案：如果我将“console.log”放在我的函数中，它也可以在我的代码中使用，问题是让函数外部的获取结果可见，因为你看到函数内部的修改不会更新全局变量。

对于普通函数它可以工作，但对于异步函数则不行，为什么？以及如何取出数据？

【问题讨论】：

标签： javascript fetch-api

【解决方案1】：

fetch 返回一个承诺。同时，脚本将转到 promise 之外的下一行，在您的情况下为 console.log(arr);

上面的代码是使用 async/await 重写的。在我看来，它使代码更具可读性。

async function run() {
    var response = await fetch('https://ipinfo.io');
    var text = await response.text();

    arr.push(text);
    dat = arr;
    prova = prova + 1;

    console.log(arr);
    console.log(dat);
    console.log(prova);
}

run();

【讨论】：