function compose (middleware) {
 // 參數(shù)middleware 是一個中間件數(shù)組，存放我們用app.use()一個個串聯(lián)起來的中間件
 // 判斷中間件列表是否為數(shù)組，如果不為數(shù)組，則拋出類型錯誤
 if (!Array.isArray(middleware)) throw new TypeError('Middleware stack must be an array!')
 // 判斷中間件是否為函數(shù)，如果不為函數(shù)，則拋出類型錯誤
 for (const fn of middleware) {
  if (typeof fn !== 'function') throw new TypeError('Middleware must be composed of functions!')
 }

 /**
 1. @param {Object} context
 2. @return {Promise}
 3. @api public
  */
 
 return function (context, next) {
  // 這里next指的是洋蔥模型的中心函數(shù)
  // context是一個配置對象，保存著一些配置，當(dāng)然也可以利用context將一些參數(shù)往下一個中間傳遞
   
  // last called middleware #
  let index = -1 // index是記錄執(zhí)行的中間件的索引
  return dispatch(0) // 執(zhí)行第一個中間件 然后通過第一個中間件遞歸調(diào)用下一個中間件
  
  function dispatch (i) {
   // 這里是保證同個中間件中一個next（）不被調(diào)用多次調(diào)用 
   // 當(dāng)next()函數(shù)被調(diào)用兩次的時候，i會小于index,然后拋出錯誤
   if (i <= index) return Promise.reject(new Error('next() called multiple times'))
   index = i
   let fn = middleware[i] // 取出要執(zhí)行的中間件
   if (i === middleware.length) fn = next // 如果i 等于 中間件的長度，即到了洋蔥模型的中心（最后一個中間件）
   if (!fn) return Promise.resolve() // 如果中間件為空，即直接resolve
   try {
    // 遞歸執(zhí)行下一個中間件 （下面會重點分析這個）
    return Promise.resolve(fn(context, dispatch.bind(null, i + 1)));
   } catch (err) {
    return Promise.reject(err)
   }
  }
 }
}

 use(fn) {
  if (typeof fn !== 'function') throw new TypeError('middleware must be a function!');
  if (isGeneratorFunction(fn)) {
   deprecate('Support for generators will be removed in v3. ' +
        'See the documentation for examples of how to convert old middleware ' +
        'https://github.com/koajs/koa/blob/master/docs/migration.md');
   fn = convert(fn);
  }
  debug('use %s', fn._name || fn.name || '-');
  this.middleware.push(fn);
  return this;
 }

let index = -1
return dispatch(0)

if (i <= index) return Promise.reject(new Error('next() called multiple times'))
index = i

    let fn = middleware[i]
    if(i === middleware.length){
     fn = next
    }
    if(!fn){
      return Promise.resolve()
    }

fn(context, function next () {
      return dispatch(i + 1)
     })

Promise.resolve( // 第一個中間件
 function(context,next){ // 這里的next第二個中間件也就是dispatch(1)
   // await next上的代碼 （中間件1）
  await Promise.resolve( // 第二個中間件
   function(context,next){ // 這里的next第二個中間件也就是dispatch(2)
     // await next上的代碼 （中間件2）
    await Promise.resolve( // 第三個中間件
     function(context,next){ // 這里的next第二個中間件也就是dispatch(3)
       // await next上的代碼 （中間件3）
      await Promise.resolve()
      // await next下的代碼 （中間件3）
     }
    )
     // await next下的代碼 （中間件2）
   }
  )
   // await next下的代碼 （中間件2）
 }
) 

async function test1(ctx, next) {
  console.log('中間件1上');
  await next();
  console.log('中間件1下');
 };
 
 async function test2(ctx, next) {
  console.log('中間件2上');
  await next();
  console.log('中間件2下');
 };
 
 async function test3(ctx, next) {
  console.log('中間件3上');
  await next();
  console.log('中間件3下');
 };
 let middleware = [test1, test2, test3];
 
 let cp = compose(middleware);
 
 cp('ctx', function() {
  console.log('中心');
 });