在JavaScript的世界里，Promise是异步编程的一种解决方案，它解决了回调地狱的问题，使得复杂的异步流程控制更加清晰和易于理解。Promise A+是Promise规范的一个版本，它为Promise的实现提供了一套统一的标准，确保了不同环境下的Promise行为一致。本篇文章将详细探讨如何手写符合Promise A+规范的Promise实现。
我们需要了解Promise的基本结构。Promise有三种状态：pending（等待中）、fulfilled（已完成）和rejected（已拒绝）。Promise实例在创建时总是处于pending状态，然后只能从pending变为fulfilled或rejected，且状态一旦改变就不可逆。这个过程通过resolve和reject函数来触发。
1. **构造函数**
Promise的构造函数接收一个执行器函数作为参数，这个函数接受两个参数：resolve和reject，它们是用于改变Promise状态的函数。在构造函数内部，我们会创建一个新的Promise实例，并在其上绑定then方法，同时执行执行器函数。
```javascript
function Promise(executor) {
this.status = 'pending'; // 初始化状态
this.value = null; // 存储fulfilled后的值
this.reason = null; // 存储rejected后的原因
let resolveCallback, rejectCallback;
// 创建resolve和reject函数，并在之后赋值给this.resolve和this.reject
function resolve(value) {
if (this.status !== 'pending') return;
this.status = 'fulfilled';
this.value = value;
if (resolveCallback) resolveCallback(value);
}
function reject(reason) {
if (this.status !== 'pending') return;
this.status = 'rejected';
this.reason = reason;
if (rejectCallback) rejectCallback(reason);
}
// 防止executor函数中的this指向错误
executor.call(null, resolve.bind(this), reject.bind(this));
}
```
2. **then方法**
then方法是Promise的核心，它允许我们注册成功和失败的回调函数。当Promise状态改变时，这些回调会被调用。
```javascript
Promise.prototype.then = function(onFulfilled, onRejected) {
onFulfilled = typeof onFulfilled === 'function' ? onFulfilled : value => value;
onRejected = typeof onRejected === 'function' ? onRejected : reason => { throw reason };
let promise2;
// 创建一个新的Promise实例，用于链式调用
promise2 = new Promise((resolve, reject) => {
if (this.status === 'fulfilled') {
try {
const x = onFulfilled(this.value);
promise2.resolve(x);
} catch (e) {
reject(e);
}
} else if (this.status === 'rejected') {
try {
const x = onRejected(this.reason);
promise2.resolve(x);
} catch (e) {
reject(e);
}
} else {
// 如果Promise还是pending，将回调存入队列，待状态改变时再调用
this.resolveCallback = () => {
try {
const x = onFulfilled(this.value);
promise2.resolve(x);
} catch (e) {
reject(e);
}
};
this.rejectCallback = () => {
try {
const x = onRejected(this.reason);
promise2.resolve(x);
} catch (e) {
reject(e);
}
};
}
});
// 返回新Promise，以便链式调用
return promise2;
};
```
3. **错误捕获**
为了处理异常情况，我们需要实现catch方法，它相当于then方法的onRejected回调。
```javascript
Promise.prototype.catch = function(onRejected) {
return this.then(null, onRejected);
};
```
4. **静态方法**
Promise还有两个静态方法：all和race。它们分别用于处理多个Promise并行执行和第一个完成的Promise。
```javascript
Promise.all = function(promises) {
return new Promise((resolve, reject) => {
let results = [], count = promises.length;
if (count === 0) {
resolve(results);
}
promises.forEach((promise, index) => {
promise.then(
value => {
results[index] = value;
if (--count === 0) resolve(results);
},
reject
);
});
});
};
Promise.race = function(promises) {
return new Promise((resolve, reject) => {
promises.forEach(promise => {
promise.then(resolve, reject);
});
});
};
```
以上就是一个基本的手写Promise A+的实现。需要注意的是，这只是Promise A+规范的一个简化版本，实际的Promise A+实现还需要考虑更多细节，如微任务处理、错误传播、链式调用的正确性等。在`main.js`文件中，你可以找到更完整的实现代码，而`README.txt`文件可能包含了一些关于如何使用和测试这个实现的说明。通过这个实践，你可以深入理解Promise的工作原理，这对于编写异步JavaScript代码至关重要。
JSRun_jF3Kp.zip （2个子文件） 
main.js 4KB
README.txt 422B
