使用 URLSearchParams 生成和解析参数字符串
2022-01-20 23:09:16
手工拼 URL 搜索字符串（URL Search String、Query String）
```
function getQueryString(api, param = {}) {
let queryArr = []
for (let k in param) {
queryArr.push(encodeURIComponent(k) + '=' + encodeURIComponent(param[k]))
}
let queryStr = ''
if (queryArr.length > 0) {
const mark = api.indexOf('?') >= 0 ? '&' : '?'
queryStr = mark + queryArr.join('&')
}
return queryStr
}
```
现在浏览器提供 URLSearchParams
```
// 如果需要支持较低版本的 PC 浏览器，需要额外安装和引用 polyfill：
// $ npm install --save url-search-params
// import URLSearchParams from 'url-search-params';
const urlSearchParams = new URLSearchParams();
```
Node.js
```
const { URLSearchParams } = require('url');
const urlSearchParams = new URLSearchParams();
```
```
/*const params = new URLSearchParams();
params.set('name', 'foo?bar');
params.set('age', 18);
console.log(params.toString());*/
// 解析搜索字符串
/*const params = new URLSearchParams('k=%E5%85%B3%E9%94%AE%E5%AD%97&p=1');
console.log(params.get('k')); // 返回字符串“关键字”，支持自动 UTF-8 解码
console.log(params.get('p')); // 返回字符串“1”
console.log(params.get('xxx')); // 如果没有 xxx 这个键，则返回 null
console.log(params.has('xxx')); // 当然也可以通过 has() 方法查询是否存在指定的键
console.log(params.keys()); // 返回一个 ES6 Iterator，内含 ['k', 'p']
console.log(params.values()); // 返一个 ES6 Iterator，内含 ['关键字', '1']
console.log(params.entries()); // 与 Map.prototype.entries() 类似
*/
/*
// search?brands=bmw&brands=audi&brands=mercedes
let params = new URLSearchParams();
params.append('brands', 'bmw');
params.append('brands', 'audi');
params.append('brands', 'mercedes');
const searchString = params.toString();
// 解析也同样简单
params = new URLSearchParams(searchString);
console.log(params.getAll('brands')); // 返回一个数组 ['bmw', 'audi', 'mercedes']
*/
```