URLSearchParams/FormData

一、URLSearchParams()（很好用，但有一定兼容问题，未来版本的浏览器中该功能的语法和行为可能随对应的标准文档而改变。）

　　URLSearchParams 接口定义了一些实用的方法来处理 URL 的查询字符串（URL参数）。URL参数开头的'?' 字符会被忽略。

　　URLSearchParams() 构造器创建并返回一个新的URLSearchParams 对象。

　　实例方法:

 

方法	描述
append()	添加新的key/value到URL中。
delete()	删除所有匹配的key/value值,重复的key都被删除。
entries()	返回所有键值对key/value。
get()	返回与给定key匹配的第一个value值。
getAll()	返回所有与给定key匹配value值。
has()	查询指定key是否存在，返回一个布尔值。
keys()	返回所有键key。
set()	设置key的value值。
toString()	返回URL字符串。
values()	返回所有值。

　　部分方法示例：

      var url = new URL('https://example.com?foo=1&bar=2&foo=4');
      var params = new URLSearchParams(url.search); // url.search为URL参数：?foo=1&bar=2
      for(let i of params){
        console.log(i)  // 使用for of可以直接遍历URLSearchParams对象实例。// ["foo", "1"] ["bar", "2"],
      }
      params.append("bd","3") // append(),添加新的key/value到URL中。
      console.log(params.toString())  // toString(),返回URL字符串。 // foo=1&bar=2&bd=3
      console.log(params.get("foo").toString()) ; // get(),返回与给定key匹配的第一个value值。 // 1
      console.log(params.getAll("foo").toString()); // getAll(),返回所有与给定key匹配value值,数组。// 1,4
      params.set("foo", "5")  // set(),设置key的value值。 
      console.log(params.toString())  // foo=5&bar=2&bd=3
      params.delete('bd') // delete(),删除所有匹配的key/value值,重复的key都被删除。
      console.log(params.toString()); // foo=5&bar=2

 　　使用场景：

　　1.处理URL参数

　　2.统一请求数据格式：

      const params = new URLSearchParams();
      params.append("url","www.example12345.com")
　　　 axios(params).then(res=>{})

 

------------------------------------------------------------------------------------------------------------------------------------------------------------------

二、FormData()

　　FormData 接口提供了一种表示表单数据的键值对的构造方式，经过它的数据可以使用 XMLHttpRequest.send() 方法送出，本接口和此方法都相当简单直接。如果送出时的编码类型被设为 "multipart/form-data"，它会使用和表单一样的格式。

　　如果你想构建一个简单的GET请求，并且通过<form>的形式带有查询参数，可以将它直接传递给URLSearchParams。

　　实现了 FormData 接口的对象可以直接在for...of结构中使用，而不需要调用entries() : for (var p of myFormData) 的作用和 for (var p of myFormData.entries()) 是相同的。

　　比起普通的ajax,使用FormData的最大优点就是我们可以异步上传一个二进制文件。

　　FormData 和 URLSearchParams的实例方法大致相同。