Promise与async处理异步问题，以及多个异步使用Promise.all 解决多异步实现同步效果

第一种Promise

let p2 = () => {
    retrun 222;
}


//例子   使用Promise的先了解里面有两个函数，第一个是成功回调 第二个是失败回调
let p3 = new Promise((resolve, reject) => {
    let res = () => {
        let y = new Date()
        return y
    }
  setTimeout(() => {
    resolve(res());   //这里是随便举一个例子异步，首先是异步请求获取的值放进放进回调函数中配合 .then使用
  }, 100);
});
p3.then((res)=>{   
    console.log(res) //当前时间    也就是说这里可以获取到数据然后跟其他变量同步使用
    console.log(p2()) 
})

//上面也就是说先执行p3里面的数据在 .then 进行同步执行

第二种 async 相对与上面的来说，这比较简单，代码简化

let get1 = () => {
    return new Promise((resolve,reject)=>{
        setTimeout(()=>{
             resolve("222")            
        },2000)    
    })
    
}
let get2 = () => {
//模拟耗时请求
    return new Promise((resolve,reject)=>{
        setTimeout(()=>{
             resolve("111")               
        },1000)    
    })    
}
let get3 = () => {
    return 333;
}
let get4 = () => {
    return 444;
}

//例子上面的函数变量然后使用async  进行异步实现   不过async要搭配await来使用，await关键字后面是等待执行的函数


 let getAllInfo = async () => {
    let info4 = await get4()
    console.log(info4)
    let info1 = await get1()
    console.log(info1)
    let info2 = await get2()
    console.log(info2)
    let info3 = await get3()
    console.log(info3)
}
getAllInfo()
//以上打印结果 444  222 111 333 
//多个await就是一个一个执行下去，有一个报错就中断执行


//async 有一个好处是可以配合try catch 来使用，可以找到那个位置出现报错
//根据上面例子
let getAllInfo = async () => {
     try {
        // body...
        let info4 = await get4()
        console.log(info4)
        let info1 = await get1()
        console.log(info1)
        let info2 = await get6() //上面没有这个函数
        console.log(info2)
        let info3 = await get3()
        console.log(info3)
    } catch(err){
        console.error(err) //打印出来就会报错
    }
    
}

第三 多个异步数据获取，实现同步效果使用Promise.all([ ]) 中 []里面是数组存放函数进行同步执行，根据时间最长为主，不过数组里面有一个报错，就不会执行

//例子
var p1 = Promise.resolve(3);
var p2 = () => {
    return 222
};


let p3 = new Promise((resolve, reject) => {
    let res = () => {
        let y = new Date()
        return y
    }
  setTimeout(() => {
    resolve(res());
  }, 100);
});



var p4 = new Promise((resolve, reject) => {
  setTimeout(() => {
    resolve(11);
  }, 2000);
});
var p5 = ()=>{
    return 1111;
}

//使用Promise.all后面 .then 函数参数里面values 就是以数组形式返回上面例子的返回值，然后就可以同步进行数据处理
Promise.all([p1, p4, p3, p5(), p2()]).then(values => {
  console.log(values); // [3,11,"2022-09-24T17:30:48.839Z",1111,222]

});