promise是什么
Promise 是 JavaScript 提供的一种用于异步编程的解决方案。Promise 代表着一个异步操作的最终完成或失败,并且可以返回其最终结果或失败原因。
一个 Promise 对象有三种状态
- pending(进行中):初始状态,既不是成功,也不是失败状态。
- fulfilled(已成功):意味着操作成功完成,并返回了一个值。
- rejected(已失败):意味着操作失败,返回了一个错误信息。
Promise:then() 方法和 catch() 方法是用于处理 Promise 对象的状态变化的回调方法。其中,then() 方法用于处理已成功的 Promise,catch() 方法用于处理已失败的 Promise。
为什么会有promise
Promise 的好处在于它可以避免回调地狱,也就是多个异步操作嵌套使用时所产生的代码结构复杂、难以维护的问题。Promise 还可以方便地进行错误处理和 Promise 链式调用,提高了代码的可读性和可维护性。
如何手写一个promise
要手写一个 Promise,需要了解它的几个核心组成部分:resolve、reject 和 then 函数。以下是一个简单的 Promise 实现示例:
class MyPromise {
constructor(callback) {
// 保存状态和结果值
this.state = 'pending';
this.value = null;
// 定义 resolve 函数
const resolve = (value) => {
if (this.state === 'pending') {
this.state = 'fulfilled';
this.value = value;
}
};
// 定义 reject 函数
const reject = (reason) => {
if (this.state === 'pending') {
this.state = 'rejected';
this.value = reason;
}
};
// 执行回调函数
try {
callback(resolve, reject);
} catch (error) {
reject(error);
}
}
then(onFulfilled, onRejected) {
// 如果没有传入成功&失败回调,将状态和结果向下传递
onFulfilled = typeof onFulfilled === 'function' ? onFulfilled : (value) => value;
onRejected = typeof onRejected === 'function' ? onRejected : (reason) => { throw reason; };
// 如果状态为成功,则执行成功回调,并返回 Promise
if (this.state === 'fulfilled') {
return new MyPromise((resolve) => {
try {
const nextValue = onFulfilled(this.value);
resolve(nextValue);
} catch (error) {
reject(error);
}
});
}
// 如果状态为失败,则执行失败回调,并返回 Promise
if (this.state === 'rejected') {
return new MyPromise((resolve, reject) => {
try {
const nextValue = onRejected(this.value);
resolve(nextValue);
} catch (error) {
reject(error);
}
});
}
// 如果状态为等待,则返回 Promise
if (this.state === 'pending') {
return new MyPromise((resolve, reject) => {
// 将回调保存到队列中,待 Promise 状态变更后执行
this.onFulfilledCallbacks.push(() => {
try {
const nextValue = onFulfilled(this.value);
resolve(nextValue);
} catch (error) {
reject(error);
}
});
this.onRejectedCallbacks.push(() => {
try {
const nextValue = onRejected(this.value);
resolve(nextValue);
} catch (error) {
reject(error);
}
});
});
}
}
}
这个 Promise 示例支持传入一个回调函数来执行异步操作,它的状态可以在回调函数执行成功后转为“已完成”,在回调函数执行失败后转为“已拒绝”,同时支持链式调用 then 函数,以及回调中的返回值可以传递到链式调用的下一个 Promise。当然这个示例还不够完善,但是它提供了一个基本的实现思路。