JavaScript 是一种单线程语言，在编写异步操作时常常会遇到回调地狱等问题。ES6 引入了 Promise 和 async/await 两种语法，可以很好地解决这些问题，本文将详细介绍这两种语法的使用。
Promise
Promise 是一种处理异步操作的对象，它有三种状态：Pending（进行中）、Fulfilled（已成功）和Rejected（已失败）。使用 Promise 的好处在于可以避免回调地狱，并能够更好地处理错误。
创建一个 Promise
我们可以通过以下方式创建一个 Promise：
const promise = new Promise((resolve, reject) => { // 在这里进行异步操作 // 异步成功时调用 resolve()，传入成功的结果 // 异步失败时调用 reject()，传入错误信息 });
使用 then() 处理异步成功的结果
当 Promise 成功时，我们可以使用 then() 方法获取到异步操作的结果。then() 方法接受两个参数：成功时的回调函数和失败时的回调函数。
promise.then(result => { console.log(result); // 处理异步成功的结果 }).catch(error => { console.error(error); // 处理异步失败的结果 });
对多个 Promise 进行并行处理
当我们需要处理多个异步操作时，我们可以使用 Promise.all() 方法将多个 Promise 对象组合成一个新的 Promise 对象，等待所有异步操作全部完成后返回结果。
-- -------------------- ---- ------- ----- -------- - -------------------------------- ----- -------- - -------------------------------- ----- -------- - -------------------------------- ---------------------- --------- ----------------------- -- - --------------------- -- --------- -------------- -- - --------------------- -- --------- ---展开代码
async/await
async/await 是 ES7 中引入的一种语法，它建立在 Promise 之上，使用起来更简单。
定义一个 async 函数
我们可以使用 async 关键字定义一个异步函数，异步函数返回一个 Promise 对象。
async function test() { // 在这里进行异步操作 // 异步成功就返回结果 // 异步失败就抛出错误 }
使用 await 处理异步结果
在异步函数中，我们可以使用 await 关键字等待异步操作结果的返回。使用 await 关键字等待异步操作结果也会阻塞代码执行，直到异步操作结束并返回结果为止。
async function test() { const result = await doAsyncOperation(); // 等待异步结果 console.log(result); // 处理异步成功的结果 }
错误处理
在 async/await 中，我们可以使用 try/catch 语句处理异步操作的错误。
async function test() { try { const result = await doAsyncOperation(); console.log(result); } catch (error) { console.error(error); } }
并行处理
在 async/await 中，我们可以使用 Promise.all() 方法实现异步操作的并行处理。
async function test() { const promise1 = getDataFromServer('/api/data1'); const promise2 = getDataFromServer('/api/data2'); const promise3 = getDataFromServer('/api/data3'); const results = await Promise.all([promise1, promise2, promise3]); console.log(results); }
示例代码
以下是使用 Promise 和 async/await 处理异步操作的完整示例代码：
-- -------------------- ---- ------- -- -- ------- ------ ----- ------- - --- ----------------- ------- -- - ------------- -- - ------------------- -- ---------- ------------------ -- ------ --- ------------------- -- - -------------------- -- --------- -------------- -- - --------------------- -- --------- --- -- -- ------------- -------- ----- -------- - -------------------------------- ----- -------- - -------------------------------- ----- -------- - -------------------------------- ---------------------- --------- ----------------------- -- - --------------------- -- --------- -------------- -- - --------------------- -- --------- --- -- -- ----------- ------ ----- -------- ------ - --- - ----- ------ - ----- ------------------- -------------------- -- --------- - ----- ------- - --------------------- -- --------- - - -- -- ----------- - ------------- -------- ----- -------- ------ - ----- -------- - -------------------------------- ----- -------- - -------------------------------- ----- -------- - -------------------------------- ----- ------- - ----- ---------------------- --------- ----------- --------------------- -- --------- -展开代码
结论
Promise 和 async/await 是现代 JavaScript 异步编程的核心语法，它们使代码更具可读性、可维护性和错误处理方便。当我们需要处理异步操作时，应当优先考虑使用这两种语法，从而提高代码的质量和可靠性。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/672041de2e7021665e0162c2
