fetch API在javascript中是如何工作的？我得到undefish，而试图获取数据，即使数据在那里

xwbd5t1u 于 2023-05-16 发布在 Java

关注(0)|答案(1)|浏览(105)

我在www.example.com上测试这个playcode.io，所以它应该对每个人都有效。
在这段代码中

let stockPriceData= new Map();
const generateMapofStockPriceData = async () =>{
    await fetch('https://64607244fe8d6fb29e30eaaf.mockapi.io/Xerodha/V1/StockPriceData')
    .then(response => response.json())
    .then(data => data.forEach(element =>{
      console.log(element.StockPrice);
      stockPriceData.set(element.StockName,element.StockPrice);
    }))
    .catch(error => console.log(error));    
    }
    generateMapofStockPriceData();
    console.log(stockPriceData);
    console.log(stockPriceData.get("ASIANPAINT"));

第一个console.log打印了map，这让我相信map已经生成了，但是下一行给出了undefined，在元素之后打印了股票价格，这意味着第一个控制台日志实际上没有数据，即stockPriceData map没有数据，但是promise之类的东西得到了解决，我很久以后才得到数据。这实际上是如何工作的，我如何得到给定键的值？
注意：我把async await放在很晚的时候，没有太多的想法，但没有它它也一样工作。

JavaScript

来源：https://stackoverflow.com/questions/76246200/how-does-fetch-api-work-in-javascript-i-am-getting-undefiend-while-trying-to-fe

1条答案

按热度按时间

zqdjd7g91#

generateMapofStockPriceData是一个异步fn。所以下面所有调用这个函数的代码都会在完成之前执行，所以你有两个选择
1.将所有代码移到fn上方
1.传递回调fn

let stockPriceData = new Map();        
const generateMapofStockPriceData = async (callbackFn) => {

     const res = await fetch('https://64607244fe8d6fb29e30eaaf.mockapi.io/Xerodha/V1/StockPriceData')
     const data = await res.json()
     data.forEach(element => {
         console.log(element.StockPrice);
         stockPriceData.set(element.StockName, element.StockPrice);
     })

     console.log(stockPriceData);
     console.log(stockPriceData.get("ASIANPAINT")); // or you can use call back 

     if (callbackFn) callbackFn()

 }

 generateMapofStockPriceData(); // this will take time code after this will be executed before finishing this . so pass a callback fn to execute after finishing above fn or move required code to above fn

赞(0）回复(0）举报 2023-05-16

我来回答

fetch API在javascript中是如何工作的？我得到undefish，而试图获取数据，即使数据在那里

1条答案

相关问题

热门标签

最新问答