MVC（Model-View-Controller）模式是前端开发中非常常见的一种代码组织方式。这种模式将应用程序分为三个主要的部分：模型（Model）、视图（View）和控制器（Controller），每个部分都有自己的职责。
在 Express.js 中，MVC 模式同样也是一种最佳实践。通过 MVC 分层的方式，我们可以更好地组织代码、提高应用程序的可维护性、并且方便团队协作。本文将介绍如何在 Express.js 中使用 MVC 模式，包括文件组织结构、路由和控制器的实现方式。
文件组织结构
在使用 MVC 模式的时候，文件组织结构是非常重要的。下面是一种常见的 MVC 文件组织结构：
-- -------------------- ---- ------- ------ --- ------------ - --- ----------------- - --- ----------------- --- ------- - --- ------------ --- ------ - --- -------- - --- --------- --- ------- - --- ------------- - --- ------------- --- ------ --- ------------ --- ---------
首先，在根目录下创建一个 app.js 文件，这个文件会负责整个应用程序的启动和配置。然后，我们在根目录下创建了四个文件夹：controllers、models、views 和 routes。这些文件夹分别存放控制器、模型、视图和路由文件。
路由
在 Express.js 中，路由是通过 express.Router() 函数来创建的。我们可以将路由文件分为多个文件，以更好地组织代码。
-- -------------------- ---- ------- -- -------------------- ----- ------- - ------------------- -- -- -------------- ----- -------------- - ----------------------------------------- ----- ------ - ----------------- -- ---- --------------- ---------------------- -- ----- -------------------- ---------------------- -------------- - -------
在上面的代码中，我们创建了一个 homeRoutes.js 文件，负责定义与 home 相关的路由。我们引入了 homeController 控制器文件，然后使用 express.Router() 创建一个路由对象。这个路由对象使用 router.get() 方法定义了两个路由，一个是首页路由，一个是登录页路由。
接下来，在 app.js 中引入 homeRoutes.js，并绑定到应用程序上。
-- -------------------- ---- ------- -- ------ ----- ------- - ------------------- -- ---- ----- ---------- - ------------------------------- ----- --- - ---------- -- - ---------- -------- ------------ ------------
其中，app.use() 方法是将路由绑定到应用程序上，"/" 表示根路由。
控制器
控制器负责处理路由请求，并返回需要渲染的视图。我们可以将控制器分为多个文件，以更好地组织代码。
-- -------------------- ---- -------
-- -----------------------------
----- --------- - -------------------------------
-- -----
-------- ---------- ---- -
------------------ -
------ ----------- --- --------
---
-
-- ------
-------- ---------- ---- -
------------------- -
------ ------
---
-
-------------- - -
------
------
--在上面的代码中，我们创建了一个 homeController.js 文件，并定义了两个函数：index 和 login。这两个函数分别对应首页和登录页路由。在这两个函数中，我们使用 res.render() 方法渲染对应的视图文件。
模型
在 Express.js 中，模型负责访问数据库（或其他数据源），并返回需要的数据。在这里，我们仅给出简单的示例。
-- -------------------- ---- -------
-- -------------------
----- ----- - -
-
--- --
----- -----
---- ---
--
-
--- --
----- -----
---- ---
--
--
-------- ---------- -
------ ------
-
-------------- - -
---------
--在上面的代码中，我们创建了一个 userModel.js 文件，并定义了一个函数 getUsers()，它返回一个包含用户信息的数组。
视图
在 Express.js 中，我们可以使用任何一种前端模板引擎来渲染视图文件。这里我们使用 ejs 模板引擎，并创建了两个视图文件：home.ejs 和 login.ejs。
-- -------------------- ---- -------
---- -------------- ---
--------- -----
------
------
---------- ----- ----------
-------
------
------- ----- -------
-------
-------
---- --------------- ---
--------- -----
------
------
---------- ----- ----------
-------
------
------- ----- -------
-------
-------在上面的代码中，我们使用 <%= title %> 输出了标题。这种方式是非常常见的，可以让我们在控制器中传递变量进来，然后在视图中进行渲染。
总结
通过上面的几个例子，我们可以看到，使用 MVC 模式可以让我们更好地组织代码、提高应用程序的可维护性、并且方便团队协作。当然，这只是 MVC 模式的一种实践方式，实际上也有很多种不同的实践方式。我们需要根据自己的情况来进行选择。
完整代码示例：
-- -------------------- ---- ------- -- ------ ----- ------- - ------------------- -- ---- ----- ---------- - ------------------------------- ----- --- - ---------- -- ------ ---------------- ----------- ------------- -------- ------- -- - ---------- -------- ------------ ------------ ---------------- -- -- - ----------------------- ---
-- -------------------- ---- ------- -- -------------------- ----- ------- - ------------------- -- -- -------------- ----- -------------- - ----------------------------------------- ----- ------ - ----------------- -- ---- --------------- ---------------------- -- ----- -------------------- ---------------------- -------------- - -------
-- -------------------- ---- -------
-- -----------------------------
----- --------- - -------------------------------
-- -----
-------- ---------- ---- -
----- ----- - ---------------------
------------------ -
------ ----------- --- --------
------
---
-
-- ------
-------- ---------- ---- -
------------------- -
------ ------
---
-
-------------- - -
------
------
---- -------------------- ---- -------
-- -------------------
----- ----- - -
-
--- --
----- -----
---- ---
--
-
--- --
----- -----
---- ---
--
--
-------- ---------- -
------ ------
-
-------------- - -
---------
---- -------------------- ---- -------
---- -------------- ---
--------- -----
------
------
---------- ----- ----------
-------
------
------- ----- -------
----
-- -------------------- -- - --
------- --------- -------
-- -- --
-----
-------
-------
---- --------------- ---
--------- -----
------
------
---------- ----- ----------
-------
------
------- ----- -------
-------
-------来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/64d0b230b5eee0b5257a736a