Promise

找出如何返回異步函數（使用Promise或回調函數）的結果，使用JavaScript。 假設你遇到了這個問題：你需要進行一個異步調用，並且需要將該調用的結果從原始函數中返回。 像這樣： const mainFunction = () => { const result = asynchronousFunction() return result } 但是asynchronousFunction()在內部執行了一些異步調用（例如fetch()調用），並且無法直接返回結果。該函數可能內部有一個需要等待的Promise，或者使用了回調函數。像這樣： const asynchronousFunction = () => { return fetch('./file.json').then(response => { return response }) } 那麼該怎麼辦呢？ 使用async/await是最直接的解決方案。您可以使用await關鍵字代替基於Promise的方法，像我們之前使用的方法一樣： const asynchronousFunction = async () => { const response = await fetch('./file.json') return response } 在這種情況下，在mainFunction中，我們需要在函數簽名前加上async，並在調用asynchronousFunction()之前加上await： const mainFunction = async () => { const result = await asynchronousFunction() return result } 現在，因為它是一個async函數，它會返回一個Promise： mainFunction() // 返回一個Promise 為了獲取結果，您可以將其封裝在IIFE中，就像這樣： (async () => { console....

我有一些使用回調函數的程式碼。不涉及太多實現細節，以下是要點： const uploadFile = (callback) => { // 上傳文件，然後將文件位置通過回調函數返回 callback(location) } uploadFile((location) => { // 執行後續操作 }) 如上所示，我調用uploadFile函數，當它完成所需操作後，就會調用該回調函數。 但是我希望在整個程式碼中都使用async/await，因此我決定在這裡使用async/await來替代回調函數。 這是我所做的：我將uploadFile函數的主體代碼用return new Promise()包裹起來，並在獲取到要返回的數據後調用resolve()： const uploadFile = () => { return new Promise((resolve, reject) => { // 上傳文件，然後通過回調函數返回文件位置 resolve(location) }) } const location = await uploadFile() 現在，我可以在第一層級中使用location數據，而不是它被包裹在回調函數中。 這有助於讓我的代碼更加整潔，並更好地理解它。 如果您有興趣，這是實際函數的完整代碼，您可以在其中看到此概念的具體示例： const uploadFile = (fileName, id, callback) => { const fileContent = fs.readFileSync(fileName) const params = { Bucket: process.env.AWS\_BUCKET\_NAME, Key: `file.jpg`, Body: fileContent } s3....

在過去幾年中，Promises 可說是 JavaScript 中最好的東西之一。 當我們調用一個返回 Promise 的函數時，我們可以使用 then() 方法來鏈接一個在 Promise 解析 時運行的函數。 以下是使用 Fetch API 的示例： fetch('/data.json') .then(response => { console.log(response.status) }) 如果在 fetch() 調用期間出現錯誤該怎麼辦？可能是因為網絡不可用，或者網絡請求返回了錯誤。 Promise 將會被拒絕。一個 Promise 會像這樣： const thePromise = new Promise((resolve, reject) => { }) 在 Promise 內部，我們會收到兩個參數，也就是兩個函數。在 Promise 主體內，如果一切正常，則會調用 resolve() 函數： const thePromise = new Promise((resolve, reject) => { resolve('OK') // 你可以傳遞任何值 }) 如果出現問題，則會調用 reject() 函數： const thePromise = new Promise((resolve, reject) => { reject('錯誤訊息') // 你可以傳遞任何值 }) 如果出現問題，我們必須處理 Promise 的拒絕。我們可以使用 Promise 的 catch() 方法來處理：...

了解一下在學習React之前是否需要學習一些東西 如果您想學習React，首先需要掌握一些基礎知識。特別是一些在React中會反覆使用的最新JavaScript功能。 有時候人們認為某個特定功能是React提供的，但實際上它只是現代JavaScript語法。 起初不需要成為這些主題的專家，但您深入研究React時，就需要更加熟練地掌握這些知識。 我將列出一些事項，並提供我撰寫的文章的連結，以幫助您快速掌握基礎知識： JavaScript類 ES模組 非同步編程的基礎知識：回調函數，Promise，async/await 箭頭函數 this關鍵字 展開運算符 解構賦值 物件字面量 JavaScript函數式編程

如何等待多个 Promise (使用 await) 同时解析 有时我们需要等待一个 Promise 解析，然后再等待另一个 Promise 解析。 就像这样： const values = await store.getAll() const keys = await store.getAllKeys() 这起作用，但不是理想的。我们首先等待第一个调用被解析，然后开始第二个。 我想先同时开始两个，并等待两个都完成。不多一毫秒。 解决方案是将所有内容封装在 await Promise.all() 调用中，像这样： const data = await Promise.all([store.getAll(), store.getAllKeys()]) 一旦这个解析完成，我们可以使用 data[0] 访问第一个调用的值，并使用 data[1] 访问第二个调用的返回值。