关于js中异步函数平行调用的小问题
最近在学习async和await关键字的时候遇到了一个小小的不容易理解的地方
直接看代码
function fun(v, timeout) {
return new Promise(resolve => {
setTimeout(resolve, timeout * 1000, v);
});
}
async function run() {
let v1 = await fun("fun1", 2);
console.log(v1);
let v2 = await fun("fun2", 2);
console.log(v2);
}
run(); // 总共需要4s
当我这样去调用的时候,是串行调用
但当我想要平行调用时
function fun(v, timeout) {
return new Promise(resolve => {
setTimeout(resolve, timeout * 1000, v);
});
}
async function run() {
let v1 = await fun("fun1", 2);
let v2 = await fun("fun2", 2);
console.log(v1);
console.log(v2);
}
run(); // 总共需要4s
这样竟然也需要4s,这就让我有点疑惑
然后我看视频后,我发现
function fun(v, timeout) {
return new Promise(resolve => {
setTimeout(resolve, timeout * 1000, v);
});
}
var p1 = fun("fun1", 2);
var p2 = fun("fun2", 2);
async function run() {
let v1 = await p1;
let v2 = await p2;
console.log(v1);
console.log(v2);
}
run(); // 总共需要2s
当我们直接等待两个Promise对象而不是函数的返回值时,它们可以同时等待
这到底有什么区别呢?
原来,当我们直接等待两个Promise对象时,这两个Promise已经开始执行,如果等待函数执行来返回Promise的话就相当于这样
async function run() {
let v1 = await fun("fun1", 2);
let p2 = fun("fun2", 2); // 首先需要执行函数获取Promise对象
let v2 = await p2;
console.log(v1);
console.log(v2);
}
而我们又知道,await后面的代码需要等待await拿到值后才执行,也就是第一个await获取到值后,第二个Promise才开始初始化,紧接着才开始被第二个await等待。
本人只是一个刚开始正式学习js的快大二的萌新,如果有错误的地方欢迎指正
哈哈哈