介绍
jeefo_url_matcher 是一款轻量级的 Javascript 库，可以对 URL 进行匹配并提取其中的参数。它支持模式匹配以及正则表达式匹配，能够满足一定范围内的 URL 匹配需求。此外，jeefo_url_matcher 还支持浏览器和 Node.js 环境。
安装
你可以通过 npm 来安装此库：
npm install jeefo_url_matcher --save
当你安装完成之后，你可以使用 CommonJS 或者 ES6 模块的方式引入：
// CommonJS const jeefo = require('jeefo_url_matcher'); // ES6 模块 import jeefo from 'jeefo_url_matcher';
使用
使用 jeefo_url_matcher，你需要创建一个 matcher 对象。一个 matcher 对象对应一个特定的 URL，你可以通过这个对象来进行匹配操作。
精确匹配
对于 URL 的精确匹配，你可以通过使用 jeefo.url.Matcher 类来创建一个 Matcher 对象。你可以使用 match 方法来匹配指定的 URL：
-- -------------------- ---- ------- ----- ----- - ----------------------------- ----- - ------- - - ---------- ----- ------- - --- ---------------------- ----- --- - ------------- ----- ------ - ------------------- -- -------- - --------------------------------------------------------- -展开代码
在上面的例子中，我们创建了一个 Matcher 对象，将要匹配的 URL 设为 "/users/123"。在 match 方法中，我们传入的 URL 为 "/users/123"，匹配成功，输出结果为：
匹配成功，参数为：{}我们在输出中发现，虽然我们的 URL 中有一个参数为 123，但是在输出结果中并没有这个参数。这是因为在精确匹配模式下，所有参数都需要精确匹配，不允许包含在根路径中。
但是，如果我们希望能够匹配包含在根路径中的参数，可以使用构造函数的第二个参数：
-- -------------------- ---- ------- ----- ----- - ----------------------------- ----- - ------- - - ---------- ----- ------- - --- --------------------- - ----- - ----- --- ----- --- - ------------- ----- ------ - ------------------- -- -------- - --------------------------------------------------------- -展开代码
在第二个参数中，我们将 exact 设为 false，表示允许在根路径中包含参数。在本例中，匹配成功，输出结果为：
匹配成功，参数为：{"id":"123"}
我们可以发现，在输出结果中我们获得了参数 id 的值。
模式匹配
除了精确匹配，jeefo_url_matcher 还支持使用模式对 URL 进行匹配。对于这种情况，我们需要使用 PatternMatcher 类来创建 Matcher 对象：
-- -------------------- ---- ------- ----- ----- - ----------------------------- ----- - -------------- - - ---------- ----- ------- - --- ---------------------------------------------- ----- --- - ---------------------------------- ----- ------ - ------------------- -- -------- - --------------------------------------------------------- -展开代码
此时，会将 URL 段 :username、:repo、:sha 和 * 映射到 result.params 对象中：
匹配成功，参数为：{"username":"microsoft","repo":"vscode","sha":"main"}
:username、:repo、:sha 分别匹配 microsoft、vscode、main，而 * 则匹配 src。值得注意的是，此例中，我们并没有使用 exact 属性，因此 URL 中的其他内容不会产生影响，即便 URL 中有多余的部分。
匹配对象
在上面的例子中，我们使用了 matcher.match 方法来进行匹配。如果在一个页面中有多个 URL 需要匹配，使用多个相似的 objects 可能会增加代码耦合度。为了避免这种情况的发生，我们可以将 matcher 对象定义为一个独立的匹配对象，然后导出该对象。
-- -------------------- ---- ------- ----- ----- - ----------------------------- ----- - ------- - - ---------- ----- ----------- - --- --------------------- - ----- - ----- --- ----- ----------- - --- --------------------- - ----- - ----- --- ------ ------- - ------------ ------------ --展开代码
通过将所有的 matcher 对象放在一个统一的文件中，可以大大减少模块间的耦合，提升代码的可维护性。
结语
jeefo_url_matcher 是一款简单易用的 URL 匹配库，可以轻松解决 URL 参数提取的问题。在日常的 Web 开发中，它可以帮你更方便地实现参数传递，提升用户体验。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/66129
