在现代 Web 开发中，处理 URL 参数是一项常见的任务。为了帮助开发人员更方便地操作 URL 参数，JavaScript 提供了 URLSearchParams 对象。本文将深入探讨该对象的用法，以及在 ECMAScript 2017 中的新功能。
URLSearchParams 对象基础
URLSearchParams 对象表示一个 URL 的查询参数部分。可以使用它来解析、操作和构建 URL 查询字符串。
创建 URLSearchParams 对象
我们可以通过多种方式创建 URLSearchParams 对象。
----- ------- - --- ---------------------------------------- -- --- --- ------- ----- ------- - --- ----------------------------------- -- ------------ ----- ------- - --- ------------------------ ------- ------- --------- -- -------------
例如，假设我们有以下 URL：https://www.example.com/search?q=javascript&page=2，则可以通过以下代码获取查询参数：
----- ------------ - --- ---------------------------------------- ----------------------------------- -- ------------ -------------------------------------- -- ---
其中，get 方法用于获取指定的查询参数值。
操作 URLSearchParams 对象
URLSearchParams 对象还提供了其他几个常用方法。
append(name, value)：添加一个新的查询参数。如果已存在同名的查询参数，则会将其值添加到该参数后面，使用&连接。set(name, value)：设置一个查询参数的值，如果已存在同名的查询参数，则会将其值覆盖为新值。delete(name)：删除指定的查询参数。toString()：返回表示当前 URLSearchParams 对象的查询字符串。
例如，我们想要在当前 URL 上添加一个新的查询参数 key=value：
----- ------------ - --- ---------------------------------------- -------------------------- --------- ---------------------- - ------------------------ -- ----------- ---
迭代 URLSearchParams 对象
URLSearchParams 对象还支持迭代器功能，可以用于对所有查询参数进行遍历。
----- ------------ - --- ---------------------------------------- --- ------ ------ ------ -- ------------- - --------------------- ----------- -
ES8 中的 URLSearchParams 对象改进
在 ECMAScript 2017（ES8）中，URLSearchParams 对象增加了一些新功能，使其更方便和高效地操作查询参数。
forEach 方法
在 ES8 中，URLSearchParams 对象新增了 forEach 方法，可以用于对所有查询参数进行遍历。
----- ------------ - --- ---------------------------------------- ---------------------------- ----- ------------- -- - --------------------- ----------- ---
其中，回调函数的第一个参数是当前查询参数的值，第二个参数是当前查询参数的名称，第三个参数是 URLSearchParams 对象本身。
sort 方法
在 ES8 中，URLSearchParams 对象还新增了 sort 方法，可以对查询参数进行排序。这对于构建一个一致的查询字符串非常有用。
----- ------------ - --- ---------------------------------------- ----- ------------- - --- ------------------------------------------ ---------------------- - ------------------------- -- ---------------- ---
其中，通过扩展运算符将 URLSearchParams 对象转换为键值对数组，然后使用数组的 sort 方法进行排序。
总结
URLSearchParams 对象是 JavaScript 的一个强大工具，在处理 URL 参数方面非常有用。无论你想解析、操作、构建 URL 查询字符串，或者遍历、排序查询参数，URLSearchParams 都是一个不错的
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/651acd1f95b1f8cacd29c5fd