在前端开发中，经常需要处理 URL 相关的操作，如解析、拼接等。而 npm 上存在许多相关的包，本文将介绍一款名为 urljs 的包。
什么是 urljs
urljs 是一个可以处理 URL 的 JavaScript 库。它是使用纯 JavaScript 编写，不依赖于任何其他库或框架，并且可以在浏览器和 Node.js 中使用。urljs 提供了一系列方法，用于解析和操作 URL。
安装和使用
使用 npm 安装 urljs：
npm install urljs
在需要使用的文件中引入 urljs：
import URL from 'urljs';
现在就可以创建 URL 实例并对其进行操作了。
URL 解析
以下是 urljs 支持的 URL 组件，这些组件都可以通过 URL 的属性获得：
- protocol: 协议，例如 "http" 或 "https"
- username: 用户名
- password: 密码
- hostname: 主机名
- port: 端口号
- pathname: 路径名
- search: 查询字符串
- hash: 锚点
下面是一个示例代码，可以把 URL 字符串解析成一个 URL 对象：
-- -------------------- ---- ------- ----- --------- - ------------------------------------------------------------------- ----- --- - --- --------------- -------------------------- -- -- ------- -------------------------- -- -- ----------------- ---------------------- -- -- ------ -------------------------- -- -- -------------------- ------------------------ -- -- --------------- ---------------------- -- -- -------
URL 操作
urljs 还提供了一些方法，用于操作 URL。以下是一些常用的方法：
toString()
将 URL 对象转换为字符串。
const url = new URL('https://www.example.com');
console.log(url.toString()); // 输出 "https://www.example.com/"removeQuery(key)
删除查询字符串中指定键名的键值对。
const url = new URL('https://www.example.com?foo=bar&baz=qux');
url.removeQuery('baz');
console.log(url.toString()); // 输出 "https://www.example.com?foo=bar"setQuery(key, value)
设置查询字符串中指定键名的键值对，如果键名已存在，则覆盖原有值。
const url = new URL('https://www.example.com?foo=bar');
url.setQuery('baz', 'qux');
console.log(url.toString()); // 输出 "https://www.example.com?foo=bar&baz=qux"Query()
获取查询字符串中的所有键值对，返回一个对象。
const url = new URL('https://www.example.com?foo=bar&baz=qux');
console.log(url.query()); // 输出 { foo: 'bar', baz: 'qux' }总结
本文介绍了 urljs 包的安装、使用和常用方法。urljs 可以方便地解析和操作 URL，使得前端开发中 URL 相关的操作变得更加简单快捷。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/37721