如何在 JavaScript 中等待非同步函數並傳回值？

如何從非同步函數等待並傳回值

使用非同步函數時，傳回值可能與同步函數不同。在本文中，我們將探討如何使用 async-await 來處理此行為。

問題：

假設您有一個非同步函數 getData 從使用 Axios 的 API。要檢索數據並記錄它，請嘗試以下程式碼：

const axios = require('axios');
async function getData() {
    const data = await axios.get('https://jsonplaceholder.typicode.com/posts');
    return data;
}
console.log(getData());

但是，您沒有記錄數據，而是得到一個處於掛起狀態的 Promise。

解決方案:

這裡的問題是您試圖等待非同步作用域之外的非同步函數的結果。要解決此問題，您需要將 console.log 封裝在非同步 IIFE（立即呼叫函數表達式）中：

async function getData() {
    const data = await axios.get('https://jsonplaceholder.typicode.com/posts');
    return data;
}

(async () => {
    const result = await getData();
    console.log(result);
})();

此模式可讓您在非同步範圍內等待 getData 函數的結果。

替代語法：

如果您的非同步函數不依賴傳回一個promise（例如，Axios回傳一個promise），您可以透過從getData中刪除async和await關鍵字來簡化語法。

function getData() {
    return axios.get('https://jsonplaceholder.typicode.com/posts');
}

然後，使用與之前相同的IIFE結構等待結果：

(async () => {
    console.log(await getData());
})();

更多資訊：

有關JavaScript 中的async/await和非同步程式設計的更多詳細信息，請參閱以下資源：

• [Async/Await in JavaScript JavaScript](https://developer.mozilla.org/en-US/docs/Web/ JavaScript/Reference/Operators/async_function)
• [JavaScript中的非同步程式設計](https://javascript.info/非同步等待）

以上是如何在 JavaScript 中等待非同步函數並傳回值？的詳細內容。更多資訊請關注PHP中文網其他相關文章！