文章目录
- 一. 手写实现PromiseA+规范
- 二. Promise.all实现
- 三. Promise.race实现
- 四. Promise.allsettled实现
- 六. Promise.any实现
- 六. 如何实现 Promise.map,限制 Promise 并发数
- 七. 实现函数 promisify,把回调函数改成 promise 形式
- 八. 并发请求控制
一. 手写实现PromiseA+规范
class Mypromise {state = 'pending'; value = undefined; reason = undefined; resolveCallbacks = []; rejectCallbacks = [];constructor(fn) {const resolveHandler = (value) => {if (this.state === 'pending') {this.state = 'fulfilled';this.value = value;console.log(this.resolveCallbacks);this.resolveCallbacks.forEach((fn) => fn(this.value));}};const rejectHandler = (reason) => {if (this.state === 'pending') {this.state = 'rejected';this.reason = reason;this.rejectCallbacks.forEach((fn) => fn(this.reason));}};try {fn(resolveHandler, rejectHandler);} catch (err) {rejectHandler(err);}}then(fn1, fn2) {fn1 = typeof fn1 === 'function' ? fn1 : (v) => v;fn2 = typeof fn2 === 'function' ? fn2 : (err) => err;if (this.state === 'pending') {const p1 = new Mypromise((resolve, reject) => {this.resolveCallbacks.push(() => {try {const newValue = fn1(this.value);resolve(newValue); } catch (error) {reject(error);}});this.rejectCallbacks.push(() => {try {const newRerson = fn2(this.reason);reject(newRerson); } catch (error) {reject(error);}});});return p1;}if (this.state === 'fulfilled') {const p1 = new Mypromise((resolve, reject) => {try {const newValue = fn1(this.value);console.log(newValue);resolve(newValue);} catch (error) {reject(error);}});return p1;}if (this.state === 'rejected') {const p1 = new Mypromise((resolve, reject) => {try {const newReason = fn2(this.reason);reject(newReason);} catch (error) {reject(error);}});return p1;}}catch(fn) {return this.then(null, fn);}finally(fn) {return this.then((value) => {return Mypromise.resolve(fn()).then(() => value)}, err => {return Mypromise.resolve(fn()).then(() => throw err)})}
}
Mypromise.resolve = function (value) {return new Mypromise((resolve, reject) => resolve(value));
};Mypromise.reject = function (value) {return new Mypromise((resolve, reject) => reject(reason));
};
二. Promise.all实现
Mypromise.all = function (promiseList = []) {const p1 = new Mypromise((resolve, reject) => {const result = [];const length = promiseList.length;let resolveCount = 0;promiseList.forEach((p, index) => {p.then((data) => {result[index] = data;resolveCount++;if (resolveCount === length) {resolve(result);}}).catch((err) => {reject(err);});});});return p1;
};
三. Promise.race实现
Mypromise.race = function (promiseList = []) {let resolved = false; const p1 = new Promise((resolve, reject) => {promiseList.forEach((p) => {p.then((data) => {if (!resolved) {resolve(data);resolved = true;}}).catch((err) => {reject(err);});});});return p1;
};
四. Promise.allsettled实现
Mypromise.allSettled = function (promiseList = []) {return new Promise((resolve, reject) => {const res = [],len = promiseList.length,count = len;promiseList.forEach((item, index) => {item.then((res) => {res[index] = { status: 'fulfilled', value: res };},(error) => {res[index] = { status: 'rejected', value: error };}).finally(() => {if (!--count) {resolve(res);}});});});
};
六. Promise.any实现
Mypromise.any = function(promiseList = []) {return new HYPromise((resolve, reject) => {const errors = [];let rejectedCount = 0promiseList.forEach((promise, index) => {HYPromise.resolve(promise).then(value => {resolve(value)},reason => {errors[index] = reason;rejectedCount++;if (rejectedCount === promiseList.length) {reject(new AggregateError(errors, 'All promises were rejected'))}})})})
}
六. 如何实现 Promise.map,限制 Promise 并发数
pMap([1, 2, 3, 4, 5], (x) => Promise.resolve(x + 1));
pMap([Promise.resolve(1), Promise.resolve(2)], (x) => x + 1);
pMap([1, 1, 1, 1, 1, 1, 1, 1], (x) => sleep(1000), { concurrency: 2 });
class Limit {constructor (n) {this.limit = nthis.count = 0this.queue = []}enqueue (fn) {return new Promise((resolve, reject) => {this.queue.push({ fn, resolve, reject })})}dequeue () {if (this.count < this.limit && this.queue.length) {const { fn, resolve, reject } = this.queue.shift()this.run(fn).then(resolve).catch(reject)}}async run (fn) {this.count++const value = await fn()this.count--this.dequeue()console.log(value);return value}build (fn) {if (this.count < this.limit) {return this.run(fn)} else {return this.enqueue(fn)}}
}Promise.map = function (list, fn, { concurrency }) {const limit = new Limit(concurrency)return Promise.all(list.map(async (item) => {item = await itemreturn limit.build(() => fn(item))}))
}const array = [1, 2, 3, 4, 5];
const concurrencyLimit = 2;const mapper = async (item) => {await new Promise((resolve) => setTimeout(resolve, 1000));return item * 2;
};Promise.map([Promise.resolve(1), Promise.resolve(2)], mapper, { concurrency: 2 }).then((results) => {console.log(results);}).catch((error) => {console.error(error);});
七. 实现函数 promisify,把回调函数改成 promise 形式
function promisify(fn) {return function (...args) {let hasCb = args.some((v) => typeof v === "function");if (hasCb) {fn(...args);} else {return new Promise((resolve, reject) => {fn(...args, cb);function cb(err, data) {if (err) {reject(err);} else {resolve(data);}}});}};
}var func1 = function (a, b, c, callback) {let rst = a + b + c;callback(null, rst);
};var func2 = promisify(func1);
func2(1, 2, 3).then((rst) => {console.log("rst", rst);
});
八. 并发请求控制
class ConcurrencyLimiter {constructor(maxConcurrency) {this.maxConcurrency = maxConcurrency;this.activeRequests = 0;this.queue = [];}async enqueue(request) {await this.waitUntilAllowed();try {this.activeRequests++;const response = await fetch(request.url);console.log(`Request ${request.id} completed with response:`, response);} catch (error) {console.error(`Request ${request.id} failed with error:`, error);} finally {this.activeRequests--;this.processQueue();}}waitUntilAllowed() {return new Promise((resolve) => {if (this.activeRequests < this.maxConcurrency) {resolve();} else {this.queue.push(resolve);}});}processQueue() {if (this.queue.length > 0 && this.activeRequests < this.maxConcurrency) {const nextRequest = this.queue.shift();nextRequest();}}
}
const limiter = new ConcurrencyLimiter(5);
const requests = [{ id: 1, url: 'https://api.example.com/data/1' },{ id: 2, url: 'https://api.example.com/data/2' },{ id: 3, url: 'https://api.example.com/data/3' },
];
requests.forEach((request) => {limiter.enqueue(request);
});function fetch(url) {return new Promise((resolve, reject) => {resolve(url)})
}