Making Asynchronous Requests with Promise and Await Functions

The promise method was introduced before the await method to make an asynchronous request for fetching data. It handles asynchronous requests with an initial state that needs time to process to return a value. When the request is done pending, it will …


This content originally appeared on DEV Community 👩‍💻👨‍💻 and was authored by JulianneHuynh

The promise method was introduced before the await method to make an asynchronous request for fetching data. It handles asynchronous requests with an initial state that needs time to process to return a value. When the request is done pending, it will either return a fulfilled value or an error causing an incomplete operation.

In this example, the declared terms state variable is passed to the useEffect hook which then becomes the effect that makes the asynchronous request. The callback function is called on once by including an empty dependency array. If the array was not included the function would constantly render. The fetchPromise variable is given a function using an axios request library. This will make an asynchronous request to the JSON. The .then method is used to obtain the data that responds in objects with key.values . A catch block can be used to identify any errors along the way.

Image description

When promises begin to accumulate it becomes difficult to follow. The async function is more organized and basically the same code as the promise method. The await keyword is used to wait for the promise to be processed first before proceeding. JavaScript requires that the await method can only be used within an async() function. To catch errors, wrap the entire function with a try-catch block. Utilizing the async/await, it's an easier and cleaner way for syntax to flow.

Image description


This content originally appeared on DEV Community 👩‍💻👨‍💻 and was authored by JulianneHuynh


Print Share Comment Cite Upload Translate Updates
APA

JulianneHuynh | Sciencx (2022-12-11T00:30:26+00:00) Making Asynchronous Requests with Promise and Await Functions. Retrieved from https://www.scien.cx/2022/12/11/making-asynchronous-requests-with-promise-and-await-functions/

MLA
" » Making Asynchronous Requests with Promise and Await Functions." JulianneHuynh | Sciencx - Sunday December 11, 2022, https://www.scien.cx/2022/12/11/making-asynchronous-requests-with-promise-and-await-functions/
HARVARD
JulianneHuynh | Sciencx Sunday December 11, 2022 » Making Asynchronous Requests with Promise and Await Functions., viewed ,<https://www.scien.cx/2022/12/11/making-asynchronous-requests-with-promise-and-await-functions/>
VANCOUVER
JulianneHuynh | Sciencx - » Making Asynchronous Requests with Promise and Await Functions. [Internet]. [Accessed ]. Available from: https://www.scien.cx/2022/12/11/making-asynchronous-requests-with-promise-and-await-functions/
CHICAGO
" » Making Asynchronous Requests with Promise and Await Functions." JulianneHuynh | Sciencx - Accessed . https://www.scien.cx/2022/12/11/making-asynchronous-requests-with-promise-and-await-functions/
IEEE
" » Making Asynchronous Requests with Promise and Await Functions." JulianneHuynh | Sciencx [Online]. Available: https://www.scien.cx/2022/12/11/making-asynchronous-requests-with-promise-and-await-functions/. [Accessed: ]
rf:citation
» Making Asynchronous Requests with Promise and Await Functions | JulianneHuynh | Sciencx | https://www.scien.cx/2022/12/11/making-asynchronous-requests-with-promise-and-await-functions/ |

Please log in to upload a file.




There are no updates yet.
Click the Upload button above to add an update.

You must be logged in to translate posts. Please log in or register.