异步函数 async function

◼ async关键字用于声明一个异步函数：
  async是asynchronous单词的缩写，异步、非同步；
  sync是synchronous单词的缩写，同步、同时；
◼ async异步函数可以有很多中写法
async function foo(){}
const foo1 = async function(){}
const foo2 = async ()=>{}
class Person{
  async foo(){}
}

异步函数的执行流程

◼ 异步函数的内部代码执行过程和普通的函数是一致的，默认情况下也是会被同步执行。
◼ 异步函数有返回值时，和普通函数会有区别：
  情况一：异步函数也可以有返回值，但是异步函数的返回值相当于被包裹到Promise.resolve中；
  情况二：如果我们的异步函数的返回值是Promise，状态由会由Promise决定；
  情况三：如果我们的异步函数的返回值是一个对象并且实现了thenable，那么会由对象的then方法来决定；
◼ 如果我们在async中抛出了异常，那么程序它并不会像普通函数一样报错，而是会作为Promise的reject来传递；

异步函数的返回值

 //1.返回值区别
  // 普通函数
    function foo1(){

    }
    foo1()//默认返回undefined
    //2.异步函数
    async function foo2() {
      //1.返回一个普通的值
      // return 321 // Promise.resolve(321)
      // 2.返回一个Promise
      // return new Promise((reslove,reject)=>{
      //   setTimeout(()=>{
      //     reslove("aaa")
      //   },3000)
      // })
      //3.返回一个thenable对象
      return{
        then:function(resolve,reject){
          setTimeout(()=>{
            resolve("bbb")
          },3000)
        }
      }
    }
    foo2()//异步函数默认返回Promise
    foo2().then(res=>{
      console.log(res)//02-异步函数-异步函数返回值.html:22 321
    })

异步函数的reject或者出现异常

  // 什么情况下结果时rejected
async function foo() {
  console.log("111111111111")
  console.log("222222222222")
  // 如果异步函数有抛出异常(产生错误),这个异常不会被立即被浏览器处理
  // 进行如下处理:Promise.reject(error)
  // "abc".filter()
  throw new Error("hdc:出错了")
  console.log("333333333333")

  return 123
}
//promise:1.pending(待定) 2.fullfiled(成功) 3.rejected(失败)
foo().then(res=>{
  console.log(res)//123
}).catch(err=>{
  console.log(err)
})

await关键字

◼ async函数另外一个特殊之处就是可以在它内部使用await关键字，而普通函数中是不可以的。
◼ await关键字有什么特点呢？
    通常使用await是后面会跟上一个表达式，这个表达式会返回一个Promise；
    那么await会等到Promise的状态变成fulfilled状态，之后继续执行异步函数；
◼ 如果await后面是一个普通的值，那么会直接返回这个值；
◼ 如果await后面是一个thenable的对象，那么会根据对象的then方法调用来决定后续的值；
◼ 如果await后面的表达式，返回的Promise是reject的状态，那么会将这个reject结果直接作为函数的Promise的reject值；
function bar(){
  console.log("bar() 函数执行")
  return new Promise((resolve,reject)=>{
    setTimeout(()=>{
      resolve(123)
    },100000)
  })
}
//await 关键字:必须在异步函数中使用
  async function foo(){
    console.log("------------")
    // await 是等待Promise有结果之后才会执行后续代码
    const res = await bar()
    console.log("await后续代码",res)
    console.log("++++++++++++")
  }
  foo()

await 和async结合使用

    //1.定义一些其他的异步函数
    function hdc(url){
      return new Promise((resolve,rejdect)=>{
        setTimeout(()=>{
          resolve(url)
        },2000)
      })
    }
   async function test(){
      console.log("test 函数")
      return "test"
    }
    async function bar() {
      console.log("bar 函数")
      return new Promise((resolve)=>{
        setTimeout(()=>{
          resolve("bar")
        },2000)
      })
    }
    async function demo() {
      console.log("demo函数")
      return{
        then:function(resolve){
          resolve("demo")
        }
      }
    }
    //2.调用的入口async函数
    async function foo() {
      const res1 = await hdc("hdc")
      console.log("res1",res1)
      // 异步函数本来就返回Promise
      const res2 = await test()
      console.log("res2",res2)
      const res3 = await bar()
      console.log("res3",res3)
      const res4 = await demo()
      console.log("res4",res4)
    }
    foo()