什么是 Promise
Promise 是一种 JavaScript 异步编程解决方案,它使得回调函数不再充斥在异步处理中,而是通过链式调用的方式进行处理,在语义上更加清晰简洁。
Promise 有三种状态:Pending,Fulfilled 和 Rejected。Pending 表示还未完成,Fulfilled 表示成功完成,Rejected 表示失败。
Promise 原生 API
Promise.all
Promise.all 方法接收一个 promise 对象数组做为参数,等到所有的 promise 对象都变为 fulfilled 或者其中有一个被 rejected,才会调用 all 返回的 promise 对象。
例如,在以下代码中,我们可以看到 all 方法等待所有的 promise 对象返回结果后,才将结果返回:
const promise_1 = Promise.resolve(1); const promise_2 = Promise.resolve(2); const promise_3 = Promise.resolve(3); Promise.all([promise_1, promise_2, promise_3]).then((values) => { console.log(values); }) // 打印结果为:[1, 2, 3]
如果其中有一个 promise 对象返回 rejected,那么 all 方法将会直接返回该 rejected 的值:
const promise_1 = Promise.resolve(1); const promise_2 = Promise.reject('error'); const promise_3 = Promise.resolve(3); Promise.all([promise_1, promise_2, promise_3]).catch((error) => { console.log(error); }) // 打印结果为:"error"
Promise.race
Promise.race 方法同样接收一个 promise 对象数组做为参数,但是只要其中有一个 promise 对象返回结果,race 就会返回该 promise 对象的结果。
与 all 方法相比,race 方法的特点在于它等待的是最快返回的 promise 对象的结果。
例如,在以下代码中,我们可以看到只有第一个 promise 对象返回结果,race 方法就返回它的结果:
-- -------------------- ---- ------- ----- --------- - --- ----------------- -- - ------------- -- - ---------------- ---- -- ------ --- ----- --------- - --- ----------------- -- - ------------- -- - ---------------- ---- -- ----- --- ------------------------ ------------------------ -- - ------------------- -- -- -------------- --
Promise.resolve
Promise.resolve 方法会返回一个 fulfilled 的 promise 对象,该对象的返回值为传入的参数值。
例如,在以下代码中,我们可以看到 resolve 方法返回一个 fulfilled 的 promise 对象,并返回参数值:
const promise = Promise.resolve('success'); promise.then((value) => { console.log(value); }) // 打印结果为:"success"
Promise.reject
Promise.reject 方法会返回一个 rejected 的 promise 对象,该对象的错误信息为传入的参数值。
例如,在以下代码中,我们可以看到 reject 方法返回一个 rejected 的 promise 对象,并将错误信息输出:
const promise = Promise.reject('error'); promise.catch((error) => { console.log(error); }) // 打印结果为:"error"
结语
通过对 Promise 的 all、race、reject、resolve 方法的学习,我们可以更好地理解 Promise 在异步编程中的优势和应用。在实际开发中,我们可以根据需求选择不同的方法,提高编程效率和性能。
希望本文能够对大家有所帮助,谢谢大家的阅读!
来源:JavaScript中文网 ,转载请注明来源 https://www.javascriptcn.com/post/67820307935627c900f364ee