出题
-
循环 items 调用 asyncUppercase，看看你们可以想出多少种 循环的方式，并行 和 串行 都实现一下，这个应用里面应该挺常见的，比如拿到了 3 个用户id ，然后发起请求 和后端要数据，这个就是异步循环
-
串行
const asyncUppercase = (item) =>
new Promise((resolve) =>
setTimeout(
() => resolve(item.toUpperCase()),
Math.floor(Math.random() * 1000)
)
)
const uppercaseItems = async () => {
// 串行
const items = ['a', 'b', 'c']
for (item of items) {
const uppercaseItem = await asyncUppercase(item)
console.log(uppercaseItem)
}
console.log('Items processed')
}
uppercaseItems()
大家还有其它串行的方法吗？
- 并行1-Promise.all
const asyncUppercase = (item) =>
new Promise((resolve) =>
setTimeout(() => {
let upper = item.toUpperCase();
resolve(upper);
console.log(upper);
}, Math.floor(Math.random() * 1000))
);
const items = ["a", "b", "c"];
Promise.all(
items.map((item) => {
return asyncUppercase(item);
})
).then((res) => {
console.log(res);
});
- 并行2 实现按照实际执行的顺序输出结果
const asyncUppercase = (item) =>
new Promise((resolve) =>
setTimeout(
() => resolve(item.toUpperCase()),
Math.floor(Math.random() * 1000)
)
);
const items = ["a", "b", "c"];
let pendingP = items.map(asyncUppercase);
// console.log(res);
new Promise((resolve, reject) => {
let index = 0;
let arr = [];
pendingP.forEach((item) => {
item.then((_res) => {
console.log(_res);
arr[index] = _res;
index++;
if (index == pendingP.length) {
resolve(arr);
}
});
});
}).then((res) => {
console.log(res);
});
- 并行3 与Promise.all效果一样
const items = ["a", "b", "c"];
let res = items.map(asyncUppercase);
console.log(res);
new Promise((resolve, reject) => {
let index = 0;
let arr = [];
res.forEach((item, i) => {
item.then((_res) => {
console.log(_res);
arr[i] = _res;
index++;
if (index == res.length) {
resolve(arr);
}
});
});
}).then((res) => {
console.log(res);
});
