async和await

• 基本用法
  • async/await 是什么
    • async/await是ES2017 新增加的两个关键字
    • async 异步
      • 可以声明一个 async 函数，表示函数里有异步操作
      • 一般只有在 async 函数中才能使用 await
      • async function fn() {}
    • await 异步等待
      • 等待一个异步操作
      • 表示紧跟在 await 后面的是异步的，需要等待结果
      • await 需要和 async 一起使用
      • 例子
        • async function fn() {
        • const result = await 异步操作（Promise 对象）
        • ...
        • }
    • 作用
      • 使异步（Promise）操作更简洁、更方便
      • 使异步代码看起来像同步的，更容易理解
  • async 函数
    • async 函数的返回值
      • async 函数的返回值是 Promise 对象
      • async 函数内部 return 后面的值，如果不是 Promise 对象，相当于包了一层 Promise.resolve() 再返回；如果是 Promise 对象，直接返回该 Promise 对象
    • async 函数的各种形式
      • 函数声明
        • function fn(){}
        • async function fn(){}
      • 函数表达式
        • const fn = function () {};
        • const fn = async function () {};
      • 箭头函数
        • const fn = () => {};
        • const fn = async () => {};
        • const fn = param => {};
        • const fn = async param => {};
      • 对象的方法
        • const obj = {
        • //fn:function(){},
        • fn:async function({}‘)
        • }
      • Class的方法
        • class ClassName {
        • // fn(){}
        • async fn() {}
        • }
    • 3.async 函数的注意事项
      • 可以通过 try...catch 或者 Promise...catch 的方式来处理错误
      • async 函数中可以没有 await
  • await函数
    • await 的机制
      • async 函数中的代码有先后关系，await 会阻塞该 async 函数中代码的执行，async 函数外的代码不受影响
      • async 函数内部是同步执行的，它本身是异步的
    • await 的值
      • 如果 await 后面是一个 Promise 对象，await 的值就是该 Promise 对象的结果（PromiseResult）
      • 如果 await 后面不是 Promise 对象，await 的值就是该值，相当于包了一层 Promise.resolve() 之后再获取该 Promise 对象的结果
    • 3.await 的注意事项
      • async 函数内部所有 await 后面的 Promise 对象都成功，async 函数返回的 Promise 对象才会成功；只要任何一个 await 后面的 Promise 对象失败，那么 async 函数返回的 Promise 对象就会失败
      • 可以通过 try...catch 或者 Promise...catch 的方式来处理错误
      • await 一般只能用在 async 函数中，async 函数中可以没有 await,有的浏览器也可以用在模块的最顶层，借用 await 解决模块异步加载的问题
  • 继发和并发
    • 使用 async/await 处理并发问题
      • 处理异步操作时，如果不存在继发关系，最好让它们并发执行
      • 可以先执行异步操作，再 await 等待结果
      • 也可以通过 Promise.all 让异步操作并发执行
    • 继发
      • const { data } = await getJSON(${url}js);
      • console.log(data);
      • const result = await getJSON(`${url}json`);
      • console.log(result);
    • 并发
      • const jsPromise = getJSON(${url}js);
      • const jsonPromise = getJSON(${url}json);
      • const jsResult = await jsPromise;
      • const jsonResult = await jsonPromise;
      • console.log(jsResult, jsonResult);
    • Promise.all 并发
      • Promise.all([getJSON(${url}js), getJSON(${url}json)]).then(
      • datas => {
      • console.log(datas);
      • }
      • );