详解URLSearchParams

<script>// URLSearchParams API 用于处理 URL 之中的查询字符串，即？之后的部分。// 没有部署这个API的浏览器，可以用url-search-params这个垫片库。var paramsString ='q=URLUtils.searchParams&topic=api';var searchParams =newURLSearchParams(paramsString);// URLSearchParams有以下方法，用来操作某个参数。// has()：返回一个布尔值，表示是否具有某个参数// get()：返回指定参数的第一个值// getAll()：返回一个数组，成员是指定参数的所有值// set()：设置指定参数// delete()：删除指定参数// append()：在查询字符串之中，追加一个键值对// toString()：返回整个查询字符串

    searchParams.has('topic')// true
    searchParams.get('topic')// "api"
    searchParams.getAll('topic')// ["api"]

    searchParams.get('foo')// null，注意Firefox返回空字符串
    searchParams.set('foo',2);
    searchParams.get('foo')// 2

    searchParams.append('topic','webdev');
    searchParams.toString()// "q=URLUtils.searchParams&topic=api&foo=2&topic=webdev"

    searchParams.append('foo',3);
    searchParams.getAll('foo')// [2, 3]

    searchParams.delete('topic');
    searchParams.toString()// "q=URLUtils.searchParams&foo=2&foo=3"// URLSearchParams还有三个方法，用来遍历所有参数。// keys()：遍历所有参数名// values()：遍历所有参数值// entries()：遍历所有参数的键值对// 上面三个方法返回的都是Iterator对象。var searchParams =newURLSearchParams('key1=value1&key2=value2');for(var key of searchParams.keys()){
      console.log(key);}// key1// key2for(var value of searchParams.values()){
      console.log(value);}// value1// value2for(var pair of searchParams.entries()){
      console.log(pair[0]+', '+ pair[1]);}// key1, value1// key2, value2// 在Chrome浏览器之中，URLSearchParams实例本身就是Iterator对象，与entries方法返回值相同。所以，可以写成下面的样子。for(var p of searchParams){
      console.log(p);}// 下面是一个替换当前URL的例子。// URL: https://example.com?version=1.0var params =newURLSearchParams(location.search.slice(1));
    params.set('version',2.0);
    window.history.replaceState({},'',`${location.pathname}?${params}`);// URL: https://example.com?version=2.0// URLSearchParams实例可以当作 POST 数据发送，所有数据都会 URL 编码。let params =newURLSearchParams();
    params.append('api_key','1234567890');fetch('https://example.com/api',{method:'POST',body: params
    }).then()// DOM的a元素节点的searchParams属性，就是一个URLSearchParams实例。var a = document.createElement('a');
    a.href ='https://example.com?filter=api';
    a.searchParams.get('filter')// "api"// URLSearchParams还可以与URL接口结合使用。var url =newURL(location);var foo = url.searchParams.get('foo')||'somedefault';</script>