洋葱圈模型

53 阅读1分钟
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body>
    <script>
      async function C() {
        console.log("进入C....");
        await fetch(url); /* 这里的意思是等待获取url */
        console.log("离开C....");
      }
      async function B() {
        console.log("进入B...");
        // 获取url
        const url =
          "https://img2.baidu.com/it/u=3190414943,87604199&fm=253&fmt=auto&app=138&f=JPEG";
        // 开始计时
        const start = Date.now(); /* 获取当前时间戳 */
        await url; /* 等待获取url */
        const ms = Date.now() - start; /* 计算总共花了多长时间 */
        console.log(`图片加载一共用了${ms}毫秒`);
        // 计时结束
        console.log("离开B....");
      }
      async function A() {
        console.log("进入A....");
        await B(); /* 等待B执行完成 */
        console.log("离开A.....");
      }

      //   都定义好了,可以直接调用了
      A();
    </script>
  </body>
</html>