介绍
在前端开发中，我们常常需要对 URL 中的路径进行匹配，以便在不同的路径下呈现不同的页面或功能。而 pathname-matcher 可以帮助我们快速简便地实现这个需求。它是一个针对 pathname 的路由匹配工具，可以帮助我们实现路径参数、正则匹配等复杂路由规则。
安装
安装 pathname-matcher 的方法非常简单，只需要在终端输入以下命令即可：
npm install pathname-matcher
使用
基本用法
pathname-matcher 的使用非常简单，只需要导入它，然后使用 match 方法即可。示例代码如下：
const PathnameMatcher = require('pathname-matcher');
const matcher = new PathnameMatcher('/user/:id');
console.log(matcher.match('/user/123')); // { id: '123' }上面的代码中，我们定义了一个路由规则 /user/:id，然后使用 matcher.match('/user/123') 进行匹配，得到了 { id: '123' } 的结果。
匹配规则
在 pathname-matcher 中，可以使用以下字符来定义路由规则：
:：表示可变参数，例如：/user/:id可以匹配/user/123或/user/abc，匹配结果为{ id: '123' }或{ id: 'abc' }。*：表示通配符，例如：/admin/*可以匹配/admin/settings，匹配结果为{ '*': 'settings' }。**：表示匹配任意字符，例如：/static/**可以匹配/static/css/style.css，匹配结果为{ '**': 'css/style.css' }。
同时，我们也可以使用正则表达式来定义路由规则。例如：
const matcher = new PathnameMatcher(/^\/(user|admin)\/(\d+)$/);
console.log(matcher.match('/user/123')); // { '0': '/user/123', '1': 'user', '2': '123' }匹配优先级
默认情况下，pathname-matcher 匹配的时候会按照路由规则的先后顺序进行匹配，也就是说，如果存在多个匹配规则，会按照先定义的规则进行匹配。
但是，我们也可以通过指定优先级来自定义匹配规则的执行顺序。示例代码如下：
const matcher = new PathnameMatcher([
{ pattern: '/user/:id', priority: 2 },
{ pattern: '/user/list', priority: 1 }
]);
console.log(matcher.match('/user/list')); // {}
console.log(matcher.match('/user/123')); // { id: '123' }上面的代码中，我们定义了两个路由规则，分别是 /user/list 和 /user/:id，并且指定了 /user/:id 的优先级为 2，/user/list 的优先级为 1。这样，在使用 match 方法匹配的时候，/user/list 不会匹配到 /user/:id，而是会匹配到 /user/list，并得到空对象作为匹配结果。
返回模式
在 pathname-matcher 中，我们可以选取自己需要的返回模式，使用 setResultMode 方法即可。pathname-matcher 支持三种模式：
ALL：返回所有匹配结果的数组。ONE：返回第一个匹配结果。FIRST：返回所有匹配结果中第一个非空的结果。
示例代码如下：
const matcher = new PathnameMatcher('/user/:id');
matcher.setResultMode(PathnameMatcher.RESULT_MODE.FIRST);
console.log(matcher.match('/user/123')); // { id: '123' }
console.log(matcher.match('/user/abc')); // {}上面的代码中，我们首先定义了一个路由规则 /user/:id，然后使用 setResultMode 方法，指定返回模式为 FIRST。这样，在使用 match 方法匹配的时候，如果存在多个匹配结果，会返回第一个非空的结果。
总结
pathname-matcher 是一个非常实用的前端路由匹配库，可以帮助我们快速、简便地实现路由规则的匹配。它支持复杂的路由规则，可以方便地处理路径参数、正则匹配等场景。在实际开发中，我们可以根据自己的需求使用不同的返回模式，来满足项目的具体需求。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/60056d1381e8991b448e6d9b