数组对象循环javascript中的问题

当我习惯于从api中forEach我的数组对象时，我遇到了麻烦，当我运行forEach时，控制台没有显示任何东西，我的代码和数组对象如下：

function renderingData(){
    const ra = fetching()
    console.log(typeof(ra))
    console.log(ra)
    ra.forEach( as => console.log(as))
}
renderingData()

数组中总共有224个对象，我的forEach nor正在工作， 这是我的抓取函数：

function fetching() {
    let result = []
    fetch("the-url", {
        "method": "GET",
        "headers": {
            "x-rapidapi-host": "the-host",
            "x-rapidapi-key": "the-key"
        }
    })
    .then(res => res.json())
    .then(res => res.response.forEach( d => {
        let ar = {
            negara:d.country,
            positif:d.cases.active,
            sembuh:d.cases.recovered,
            meninggal:d.deaths.total,
            total:d.cases.total
        }
        result.push(ar)
    }))
    return result
}

但当我试着这样写maual数组时：

function renderingData(){
    // const ra = fetching()
    const rr = [{negara: "China", positif: 723, sembuh: 77474, meninggal: 4633, total: 82830},
    {negara: "Italy", positif: 105813, sembuh: 66624, meninggal: 26977, total: 199414},
    {negara: "Spain", positif: 85069, sembuh: 120832, meninggal: 23521, total: 229422},
    {negara: "Germany", positif: 37839, sembuh: 114500, meninggal: 6050, total: 158389}
    ]
    console.log(typeof(rr))
    console.log(rr)
    rr.forEach( as => console.log(as))
}
renderingData()

---

一切都很正常，对于每一个正在工作的人来说，请如何解决这个问题？

你误解了承诺的异步性。别担心，它们很复杂

如果我必须给你上面的麻雀，你就不会再使用

return

让我们看看您的

获取功能：

function fetching() {
    let result = []
    fetch("the-url", {
        "method": "GET",
        "headers": {
            "x-rapidapi-host": "the-host",
            "x-rapidapi-key": "the-key"
        }
    })
    .then(res => res.json())
    .then(res => res.response.forEach( d => {
        let ar = {
            negara:d.country,
            positif:d.cases.active,
            sembuh:d.cases.recovered,
            meninggal:d.deaths.total,
            total:d.cases.total
        }
        result.push(ar)
    }))
    return result
}

let results = await fetching();

你发现了吗

您混合了同步和异步方法。在函数顶部，将
result
声明为空数组。之后，开始提取

返回
不会等待承诺完成，取回会在它自己的冒险中开始，您的返回会立即发生（在您的任何数据返回之前！）

下面是发生的情况：

fetching called ----------> return result (empty array)
|
|
|
(eventually, some time later)
|
|
|
V
Promise fulfilled, data is sent back

或者，作为列表：

调用您的
获取
函数
创建一个空的结果数组并开始提取
返回空数组
一段时间后，数据返回。你错过了
你可以做很多事情来解决这个问题。旧的方法之一是使用回调

function fetching(callback){
    // After the forEach, but still in the .then:
    if(callback) callback(result);
}

一些更好的方法是回报你自己的承诺。您可以使用
newpromise（）
对象。实现起来并不复杂

当然，两者都需要您修改
renderingData
函数

最后，如果你不在乎Internet Explorer（我不在乎！），你可以使用
async
和
wait
，这是我最喜欢的。它使代码更具可读性

研究所有这些选择，并使用任何你感到舒服的

下面是一个使用
async
和
await
的简短示例，现代解决方案（同样，如果您试图让Internet Explorer运行此功能，它将被打乱）

要使用抓取功能，请执行以下操作：

function fetching() {
    let result = []
    fetch("the-url", {
        "method": "GET",
        "headers": {
            "x-rapidapi-host": "the-host",
            "x-rapidapi-key": "the-key"
        }
    })
    .then(res => res.json())
    .then(res => res.response.forEach( d => {
        let ar = {
            negara:d.country,
            positif:d.cases.active,
            sembuh:d.cases.recovered,
            meninggal:d.deaths.total,
            total:d.cases.total
        }
        result.push(ar)
    }))
    return result
}

let results = await fetching();

这就是为什么我推荐async和Wait！更干净的代码，看！您仍然可以像使用普通函数一样使用return！太好了

请注意，任何使用wait的函数都需要标记为async。这意味着您需要更改：

async function renderingData

…以及
什么是
获取
功能？我假设它是异步的（同步网络操作会使您的页面冻结），并且您没有以任何方式等待（例如，使用
.then
或
wait
），因此这可能是一个未实现的承诺。但是我们不知道。谢谢你的回答，先生，我已经用我的回帖编辑了我的问题function@blanksix为什么不使用forEach的map函数呢？我不知道如何使用它，先生，先生，你能在我的图1中用图2查看控制台中的数组吗，控制台1没有显示（224）[{…}{…}{…}}}像图2显示的（4）[{…}{...}{...}]是麻烦吗？你能帮我举一个关于回拨的例子吗？先生，如果我的数据完成后，我不想回拨，准备用于其他功能，我不知道，谢谢@AlgoRythm@blanksix回调真的是为恐龙准备的，当它们流行时，那是一个充满糟糕代码的糟糕时期！我真的建议使用异步回调我会给你一个简短的例子，但我不想让你失去乐趣！所以我不会为你写代码，先生，我只是举个例子来描述case@blanksix看看我最近的additioncopy先生，对不起，你能给我一个关于旧方法或回调函数的例子吗？这样我就可以想象异步是如何工作的，谢谢