async函数执行顺序

/**
 * Async函数能让你的 Promise 代码更简洁,this都可以省略了
 * async函数，和普通函数一样
 * await 后面要跟一个 Promise才有意义
 * 1.等待Promise中resolve才会往后执行
 * 2.如果resolve有参数，可以在await前面接收使用
 * 任何函数都可以被标记为async
 *      箭头函数，命名函数，匿名函数
 * Async函数执行顺序
 *      函数中的await只是在函数内部等待而已，不会阻塞函数之后的代码执行
 * Async函数的返回值
 */
//就是一个函数，一会儿别人调用
function sleep (time) {
    return new Promise((resolve, reject) => {
        setTimeout(function () {
            // console.log('444')
            resolve()
        },time)
    })
}
//回调地狱（太麻烦，不推荐使用）
// setTimeout(function () {
//   console.log(1)//隔1秒显示
//   setTimeout(function () {
//     console.log(2)//隔2秒显示从0开始和之前的没关系
//     setTimeout(function () {
//       console.log(3)//隔3秒显示从0开始和之前的没关系
//       setTimeout(function () {
//         console.log(4)//隔4秒显示从0开始和之前的没关系
//       }, 4000)
//     }, 3000)
//   }, 2000)
// }, 1000)


//Promise
//调用sleep函数
// sleep(1000)
//     .then(function () {
//         console.log(1)//隔1秒显示
//         return sleep(2000)
//     })
//     .then(() => {
//         console.log(2)//隔2秒显示从0开始和之前的没关系
//         return sleep(3000)
//     })
//     .then(() => {
//         console.log(3)//隔3秒显示从0开始和之前的没关系
//     })

//async函数  
async function main () {
    console.log('step => 2')//进来就执行
    //await后面跟普通数据没有意义
    // const data = await 123
    // console.log(data)//123

    //后面跟Promise对象才有意义
    //await会等待 Promise对象中 resolve 了才继续往后执行,就是3秒后执行
    await sleep(3000)//多少秒后执行,3秒后才执行下面的
    console.log('step => 3')
    console.log(1)

    // await 会等待 Promise resolve
    // 如果 resolve 有参数，我们可以在 await 前面声明变量|常量接收
    const data = await new Promise((resolve, reject) => {
        resolve('hello')
    })
    console.log(data)

    await sleep(2000)
    console.log(2)
}
main()
console.log('step => 4')//第二个执行
// step => 2
// step => 4
// step => 3
// 1
// hello
// 2