回调地狱

什么是回调地狱？

异步请求容易构成回调地狱

怎么优化回调地狱

• 拆解function：将各步拆解为单个的function

• 事件发布/监听模式

  • 一方面监听某一事件，当事件发生时，进行相应回调操作，另一方面当某些操作完成之后，通过发布事件触发函数，这样就可以将原本捆绑在一起的代码解耦

• Promise

  readFile('./sample.txt').then(content => {
       let keyword = content.substring(0, 5);
       return queryDB(keyword);
   }).then(res => {
       return getData(res.length);
   }).then(data => {
       console.log(data);
   }).catch(err => {
       console.warn(err);
   });
  复制代码

• generator

  • generator是es6中的一个新的语法。在function关键字后添加*即可将函数变为generator。

  const generator = function* () {
      yield 11;
      yield 22;
      return 33;
  }
  复制代码

  • 执行generator将会返回一个遍历器对象，用于遍历generator内部的状态

      let g = generator();
      g.next(); // { value: 11, done: false }
      g.next(); // { value: 22, done: false }
      g.next(); // { value: 33, done: true }
      g.next(); // { value: undefined, done: true 
  复制代码

• async/await

  • 任何一个函数都可以成为async函数

      async function foo () {};
      const foo = async function () {};
      const foo = async () => {};
      在async函数中可以使用await语句。await后一般是一个Promise对象。
      async function foo () {
          console.log('开始');
          let res = await post(data);
          console.log(`post已完成，结果为：${res}`);
      };
  复制代码

  • 当上面的函数执行到await时，可以简单理解为，函数挂起，等待await后的Promise返回，再执行下面的语句