导航  导航

js中间件的实现,简单 容易理解

作者: 挺帅
发表于:
更新于:

中间件是一张设计模式,所谓中间件,简单的理解就好比工厂的流水线,每一个流程需要用到的机器都是一个中间件,对产品进行加工包装。

我们在使用vue、react等前端框架或者nodejs的koa、express等框架的时候,使用中间件通常是下面这种方式:

app.use(function(ctx,next){
  ctx.title = "hello"
  next()
})


那么我们如何使用js编码,能够实现上面的用法呢?接下来,咱们就动手实现一下:


const app = {
  fns:[],
  use:function(fn){
    this.fns.push(fn)
  },
  run:function(ctx,callback){
    let i = 0
    const next = () => {
      i++
    }
    this.fns.map((fn,index) => {
      if(i == index){
        fn(ctx,next)
      }
    })
    i == this.fns.length && callback && callback(ctx)
  }
}
app.use(function(ctx,next){
  ctx.title = "hello"
  next()
})
app.run({},function(ctx){
  console.log(ctx)  // 输出{ title: 'hello' }
})



如果觉得文章还不错,或者对你有帮助的话,那就点个赞呗! 点赞2
向右滑动

全部评论(0)