答案:实现一个类Express中间件系统,通过use添加函数到队列,run启动流程,next控制执行流转。核心是维护中间件数组并递归调用next执行下一个,支持同步与异步操作,可扩展错误处理。

实现一个类似 Express 的 JavaScript 中间件模式,核心是将多个函数串联起来,通过 next() 控制流程的流转。中间件可以处理请求、修改数据或终止响应。下面是一个简易但完整的实现方式。
基本结构:创建一个支持 use 和 listen 的类
我们定义一个类,用来管理中间件队列,并提供 use() 添加中间件,以及启动流程的方法(比如 listen() 或 run())。
class Middleware { constructor() { this.stack = []; // 存储中间件函数 } use(fn) { if (typeof fn === 'function') { this.stack.push(fn); } } run(req, res, finalCallback) { const next = (index) => { if (index >= this.stack.length) { return finalCallback ? finalCallback() : null; } const middleware = this.stack[index]; // 执行当前中间件,传入 req, res, 和下一个 next middleware(req, res, () => next(index + 1)); }; next(0); // 从第一个中间件开始执行 }}
使用示例:模拟请求处理流程
我们可以像 Express 一样添加多个中间件,每个中间件可以选择调用 next() 继续,或者不调用以终止流程。
立即学习“Java免费学习笔记(深入)”;
const app = new Middleware();// 日志中间件app.use((req, res, next) => { console.log(`Request URL: ${req.url}`); next();});// 身份验证中间件app.use((req, res, next) => { if (req.headers.authorization) { req.user = { id: 1, name: 'Alice' }; } next();});// 数据处理中间件app.use((req, res, next) => { req.body = { message: 'Hello from middleware' }; next();});// 最终响应app.run( { url: '/home', headers: { authorization: 'Bearer xxx' } }, {}, () => { console.log('Finished processing request.'); });
关键机制说明
函数队列:所有中间件按顺序存入数组,依次执行。next 函数递归调用:每个中间件接收一个 next 函数作为第三个参数,调用它才会进入下一个中间件。异步兼容性:如果某个中间件是异步的,可以在其内部使用 Promise 或 async/await,并在完成后调用 next()。错误处理扩展:可进一步扩展为支持错误中间件(如 use(err, req, res, next)),但基础版本先忽略。
进阶思路:支持异步中间件
若中间件中包含异步操作,需确保正确等待。可以使用 Promise 改造 next 流程:
run(req, res, finalCallback) { const stack = this.stack; let index = 0; const next = () => { if (index >= stack.length) { return Promise.resolve(finalCallback ? finalCallback() : null); } const handler = stack[index++]; try { const result = handler(req, res, next); // 如果中间件返回 Promise,则等待完成 return Promise.resolve(result); } catch (err) { console.error('Middleware error:', err); } }; return next();}
这样就能支持如下写法:
app.use(async (req, res, next) => { const data = await fetch('/api/data'); req.data = await data.json(); next();});
基本上就这些。一个轻量的中间件系统只需要维护函数队列和控制流转的 next 机制。Express 的底层原理也类似,只是更复杂,加入了路由匹配、错误处理等模块。
以上就是如何实现一个JavaScript的中间件模式,比如Express中的中间件?的详细内容,更多请关注创想鸟其它相关文章!
版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至 chuangxiangniao@163.com 举报,一经查实,本站将立刻删除。
发布者:程序猿,转转请注明出处:https://www.chuangxiangniao.com/p/1524452.html
微信扫一扫
支付宝扫一扫