javascript promise的用法
- 格式：docx
- 大小：12.52 KB
- 文档页数：6
javascript promise的用法
一、前言
Promise 是 JavaScript 中的一个重要概念，它是一种异步编程解决方案。在 ES6
中引入了 Promise，可以更方便、更优雅地控制异步程序的执行顺序，以及有效避免回调地狱的问题。本文将详细介绍 Promise 的基本用法。
二、Promise 的基本概念
Promise 是一个对象，用来表示异步操作的最终完成（或失败）及其结果。Promise 的主要状态如下：
- pending（进行中）：Promise 对象创建后的初始状态。
- fulfilled（已完成）：异步操作成功完成时的状态。
- rejected（已拒绝）：异步操作失败时的状态。
Promise 的实例有以下三个方法：
- then()：当异步操作成功完成时调用，接收一个参数，即异步操作的结果。
- catch()： 当异步操作失败时调用，接收一个参数，即失败的原因。
- finally()：当异步操作完成时（无论成功或失败）执行，不接收任何参数。
三、Promise 的基本用法
1. Promise 的创建
Promise 可以通过 new Promise() 来创建，它是一个构造函数，接收一个执行器函数作为参数。执行器函数接收两个函数作为参数：resolve 和 reject，分别表示异步操作成功完成和失败。
```javascript
const promise = new Promise((resolve, reject) => {
// 异步操作代码
const isSuccess = true;
if (isSuccess) { resolve('操作成功！');
} else {
reject('操作失败！');
}
})
```
执行器函数中包含异步操作的代码，代码中需要判断异步操作的结果，如果成功就调用 resolve，并传递操作结果作为参数；如果失败就调用 reject，并传递失败原因作为参数。
2. Promise 的状态转换
Promise 的状态可能会从 pending 转换为 fulfilled 或 rejected。且状态一旦发生变化就不能再次改变，也就是说，一旦成功或失败就不能再进行其他操作。Promise 状态的转换可以通过调用 resolve 或 reject 方法来完成。
```javascript
promise.then(result => {
console.log(result); // 操作成功！
}).catch(error => {
console.log(error); // 操作失败！
})
```
then 方法用于注册当异步操作完成时的回调函数，它接收一个参数：onFulfilled。如果异步操作成功完成，就会调用 onFulfilled，将异步操作的结果传递给它。catch 方法用于注册当异步操作失败时的回调函数，它接收一个参数：onRejected。如果异步操作失败，就会调用 onRejected，将失败原因传递给它。
3. Promise 的链式调用
Promise 的 then 方法可以返回一个新的 Promise 实例，以便链式调用。
```javascript const promise = new Promise((resolve, reject) => {
const isSuccess = true;
if (isSuccess) {
resolve('操作成功！');
} else {
reject('操作失败！');
}
})
promise.then(result => {
return result + ' 第一次处理。';
}).then(result => {
console.log(result); // 操作成功！ 第一次处理。
}).catch(error => {
console.log(error); // 操作失败！
})
```
上述代码中，promise.then() 方法返回一个新的 Promise 实例，其操作是将异步操作返回的结果与字符串 `' 第一次处理。'` 进行拼接。新的 Promise 实例再次调用
then() 方法，可以继续进行操作。
4. Promise.all()
Promise.all() 方法接收一个 Promise 实例的数组，并返回一个新的 Promise 实例。当数组中所有的 Promise 实例都成功完成时，新的 Promise 实例才会成功完成。新
Promise 实例的结果是所有完成实例结果的数组。
```javascript
const promise1 = new Promise(resolve => {
setTimeout(() => { resolve('我是 promise1！');
}, 1000);
})
const promise2 = new Promise(resolve => {
setTimeout(() => {
resolve('我是 promise2！');
}, 2000);
})
Promise.all([promise1, promise2]).then(result => {
console.log(result); // ["我是 promise1！", "我是 promise2！"]
})
```
上述代码中，Promise.all() 方法接收一个 promise1 和 promise2 组成的数组。promise1 的 resolve 时间为 1 秒，promise2 的 resolve 时间为 2 秒。新的 Promise
实例会等待所有的 Promise 实例完成后，返回结果数组。
5. Promise.race()
Promise.race() 方法接收一个 Promise 实例的数组，并返回一个新的 Promise 实例。新 Promise 实例将会在数组中第一个完成的 Promise 实例完成的时候被完成，它的结果将是第一个成功或失败的实例的结果。
```javascript
const promise1 = new Promise(resolve => {
setTimeout(() => {
resolve('我是 promise1！');
}, 1000);
})
const promise2 = new Promise((resolve, reject) => { setTimeout(() => {
reject('我是 promise2！');
}, 2000);
})
Promise.race([promise1, promise2]).then(result => {
console.log(result); // 我是 promise1！
}).catch(error => {
console.log(error); // 我是 promise2！
})
```
上述代码中，Promise.race() 方法接收一个 promise1 和 promise2 组成的数组，它们的结果先后完成，promise1 的 resolve 时间为 1 秒，promise2 的 reject 时间为
2 秒。新的 Promise 实例将会在第一个完成的 Promise 实例 resolve 或 reject 完成之后，完成并返回相应结果。此例中，因为 promise1 运行速度快，因此新的 Promise
实例的结果是 '我是 promise1！'。
6. Promise.resolve() 和 Promise.reject()
Promise.resolve() 和 Promise.reject() 分别用于创建已经成功完成或失败的
Promise。它们的语法如下：
```javascript
const resolvedPromise = Promise.resolve('已完成的 Promise');
const rejectedPromise = Promise.reject('失败的 Promise');
```
resolvedPromise 是状态为 fulfilled 并且结果为 '已完成的 Promise' 的
Promise 实例，rejectedPromise 是状态为 rejected 并且结果为 '失败的 Promise' 的
Promise 实例。在实际开发中，它们一般用于处理异步代码中的一些简单操作，如返回一个空数组等情况。
四、Promise 的应用场景
Promise 在实际开发中有很多用处，比如： 2. 防止回调地狱
在异步代码中，如果操作较多，嵌套较深，就容易产生回调地狱。而 Promise 可以通过进行链式调用，来避免回调地狱的问题。
3. 统一处理异步代码
在异步代码中，不同的模块可能需要处理相同的异步代码。使用 Promise 将异步操作封装起来，可以实现异步代码的复用，提高代码的简洁性和可维护性。
五、总结
Promise 是一种管理异步操作，并处理异步操作结果的方法。Promise 使得异步代码的编写更加优雅，也避免了回调地狱的问题。Promise 的基本用法主要包括创建 Promise
实例、状态转换、链式调用、Promise.all()、Promise.race()、Promise.resolve() 和
Promise.reject() 等。在实际开发中，我们经常使用 Promise 处理异步代码，有效提高了开发效率和代码的可维护性。
