Es2015 generation配合axios请求数据

index.html

<!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">
    <link rel="icon" href="<%= BASE_URL %>favicon.ico">
    <script src="https://unpkg.com/axios/dist/axios.min.js"></script>
    <title>es6test</title>
  </head>
  <body>
    <noscript>
      <strong>We're sorry but es6test doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
    </noscript>
    <div id="app"></div>
    <script type="module">
      // 实际操作中genarator一般配合promis使用
      function * gen(){
        let val = yield 'itstrive';
        yield axios.get('https://api.github.com/users/' + val);
      }
      let g1 = gen();
      let username = g1.next().value; //获取第一条信息 名字
      console.log(username); // itstrive

     
      g1.next().value.then(res=>{
        console.log(res.data); // 一堆json数据
      });

      // 异步:不连续,上一个操作没有执行完,下一个操作照样开始
      // 同步:连续执行,上一个操作没有执行完,下一个没法开始

      // 关于异步,解决方案:
      // 回调函数、事件监听、发布/订阅、promise对象

      // Es2017,规定async解决异步更加优雅
      


    </script>
    <!-- built files will be auto injected -->
  </body>
</html>
Last modification:June 18th, 2019 at 10:57 am
If you think my article is useful to you, please feel free to appreciate

Leave a Comment