promise用法总结以及手写promise
JavaScript中的 Promise 是用于处理异步操作的对象，它代表了一个异步操作的最终完成（或失败）及其结果值。Promise 是异步编程的一种更简洁和更可读的方式，避免了回调地狱的问题。
- Promise 的基本概念
一个 Promise 是一个表示异步操作最终完成（或失败）并返回结果的对象。Promise 具有三种状态：
Pending（待定）：初始状态，表示异步操作尚未完成。
Resolved/Fulfilled（已完成）：操作成功完成，返回值。
Rejected（已拒绝）：操作失败，返回错误信息。
2. Promise 构造函数
let promise = new Promise((resolve, reject) => {
// 异步操作
if (成功) {
resolve(结果); // 操作成功，返回结果
} else {
reject(错误信息); // 操作失败，返回错误信息
}
});
resolve(value)：改变 Promise 状态为 fulfilled，并传递一个值。
reject(error)：改变 Promise 状态为 rejected，并传递一个错误。
3. Promise 的状态转换
初始状态：pending
状态1：resolved，调用 resolve()。
状态2：rejected，调用 reject()。
4. Promise 的链式调用
Promise 支持链式调用，可以通过 .then()、.catch() 和 .finally() 来处理异步操作的结果。
4.1 then()
then() 用于定义成功和失败的回调函数。
promise
.then((result) => {
console.log('成功：', result);
})
.catch((error) => {
console.error('失败：', error);
});
then() 接受两个回调函数：
第一个回调函数用于处理成功的结果。
第二个回调函数用于处理失败的结果（可选）。
4.2 catch()
catch() 用于捕获并处理异常。通常与 then() 一起使用。
promise
.then(result => {
console.log(result);
})
.catch(error => {
console.error(error);
});
4.3 finally()
finally() 用于在 Promise 完成（无论是成功还是失败）后执行清理操作。
promise
.then(result => {
console.log('成功：', result);
})
.catch(error => {
console.error('失败：', error);
})
.finally(() => {
console.log('无论成功或失败，都执行');
});
- Promise 的常见静态方法
5.1 Promise.resolve()
Promise.resolve() 返回一个已经解决的 Promise，其值是传入的参数。
let promise = Promise.resolve(42);
promise.then(value => {
console.log(value); // 输出 42
});
5.3 Promise.all()
Promise.all() 接收一个 Promise 数组，返回一个新的 Promise，当所有的 Promise 都成功时，该 Promise 会成功，返回一个数组。只要有一个 Promise 失败，整个 Promise.all() 就会失败。
Promise.all([promise1, promise2, promise3])
.then(results => {
console.log(results); // 所有 promise 成功时的结果数组
})
.catch(error => {
console.error(error); // 如果有一个失败，捕获错误
});
5.4 Promise.allSettled()
Promise.allSettled() 接收一个 Promise 数组，返回一个新的 Promise，无论所有的 Promise 是成功还是失败，都会在所有 Promise 结束后返回。
Promise.allSettled([promise1, promise2])
.then(results => {
console.log(results); // 输出每个 promise 的状态（fulfilled/rejected）
});
5.5 Promise.race()
Promise.race() 返回一个新的 Promise，它会在第一个 Promise 完成（无论是成功还是失败）时返回。
Promise.race([promise1, promise2])
.then(result => {
console.log(result); // 第一个完成的 promise 的结果
})
.catch(error => {
console.error(error); // 第一个失败的 promise 错误
});
5.6 Promise.any()
Promise.any() 返回一个新的 Promise，它会在第一个成功的 Promise 返回时成功。如果所有的 Promise 都失败，返回一个 AggregateError。
Promise.any([promise1, promise2])
.then(result => {
console.log(result); // 第一个成功的 promise 的结果
})
.catch(error => {
console.error(error); // 如果所有 promise 都失败，捕获错误
});
-
Promise 的手动实现
实现一个基本的 Promise 类：
class MyPromise {
constructor(executor) {
this.state = ‘pending’; // 初始状态
this.value = undefined; // 成功时的值
this.reason = undefined; // 失败时的原因this.onFulfilled = []; // 存储成功的回调
this.onRejected = []; // 存储失败的回调const resolve = (value) => {
if (this.state === ‘pending’) {
this.state = ‘fulfilled’;
this.value = value;
this.onFulfilled.forEach(fn => fn(value));
}
};const reject = (reason) => {
if (this.state === ‘pending’) {
this.state = ‘rejected’;
this.reason = reason;
this.onRejected.forEach(fn => fn(reason));
}
};executor(resolve, reject);
}
then(onFulfilled, onRejected) {
return new MyPromise((resolve, reject) => {
if (this.state === ‘fulfilled’) {
const result = onFulfilled(this.value);
resolve(result);
} else if (this.state === ‘rejected’) {
const result = onRejected(this.reason);
reject(result);
} else {
this.onFulfilled.push(() => {
const result = onFulfilled(this.value);
resolve(result);
});
this.onRejected.push(() => {
const result = onRejected(this.reason);
reject(result);
});
}
});
}
}