「这是我参与11月更文挑战的第1天，活动详情查看：2021最后一次更文挑战」
简介：
FormData 对象用以将数据编译成键值对，以便用 XMLHttpRequest 来发送数据。
主要用于：发送表单数据，也可用于发送带键数据(keyed data)，而独立于表单使用。
如果表单 enctype 属性设为 multipart/form-data ，则会使用表单的 submit() 方法来发送数据，从而发送数据具有同样形式。
1.1 创建一个空对象
1.2 使用已有表单来初始化对象
formData 里面存储的数据是以健值对的形式存在的，key 是唯一的，一个 key 可能对应多个 value。 如果是使用表单初始化，每一个表单字段对应一条数据，它们的 HTML name 属性即为 key 值，它们 value 属性对应 value 值。
get(key) 与 getAll(key) 获取相对应的值；
append(key,value) 在数据末尾追加数据；
set(key, value) 设置修改数据；
key 的值不存在，添加一条数据；
key 的值存在，修改对应的 value 值；
has(key) 判断是否存在对应的 key 值
delete(key) 删除数据
entries() 获取一个迭代器，然后遍历所有的数据
可以看到返回迭代器的规则
- 每调用一次 next() 返回一条数据，数据的顺序由添加的顺序决定；
- 返回的是一个对象，当其 done 属性为 true 时，说明已经遍历完所有的数据，这个也可以作为判断的依据；
- 返回的对象的 value 属性以数组形式存储了一对 key/value，数组下标 0 为 key，下标 1 为 value。如果一个 key 值对应多个value，会变成多对 key/value 返回；
FormData 对象的使用：
- 用一些键值对来模拟一系列表单控件：把 form 中所有表单元素的 name 与 value 组装成一个 queryString；
- 异步上传二进制文件；
FormData 对象的操作方法，全部在原型中本身没任何的属性及方法
使用 FormData 对象发送文件
使用 jQuery
使用 axios
XMLHttpRequest（XHR）对象用于与服务器交互。通过 XMLHttpRequest 可以在不刷新页面的情况下请求特定 URL，获取数据。这允许网页在不影响用户操作的情况下，更新页面的局部内容。XMLHttpRequest 在 AJAX 编程中被大量使用。
XMLHttpRequest 对象提供了对 HTTP 协议的完全的访问，包括做出 POST 和 HEAD 请求以及普通的 GET 请求的能力。XMLHttpRequest 可以同步或异步地返回 Web 服务器的响应，并且能够以文本或者一个 DOM 文档的形式返回内容。
尽管名为 XMLHttpRequest，它并不限于和 XML 文档一起使用：它可以接收任何形式的文本文档。
5.1 属性
readyState HTTP 请求的状态。
当一个 XMLHttpRequest 初次创建时，这个属性的值从 0 开始，直到接收到完整的 HTTP 响应，这个值增加到 4。
5 个状态中每一个都有一个相关联的非正式的名称，下表列出了状态、名称和含义：
readyState 的值不会递减，除非当一个请求在处理过程中的时候调用了 abort() 或 open() 方法。
每次这个属性的值增加的时候，都会触发 onreadystatechange 回调函数。
responseText
目前为止为服务器接收到的响应体（不包括头部），或者如果还没有接收到数据的话，就是空字符串。
如果 readyState 小于 3，这个属性就是一个空字符串。
当 readyState 为 3，这个属性返回目前已经接收的响应部分。
如果 readyState 为 4，这个属性保存了完整的响应体。
如果响应包含为响应体指定字符编码的头部，就使用该编码。否则，假定使用 Unicode UTF-8。
responseXML
对请求的响应，解析为 XML 并作为 Document 对象返回。
status
由服务器返回的 HTTP 状态代码，如 200 表示成功，而 404 表示 “Not Found” 错误。
当 readyState 小于 3 的时候读取这一属性会导致一个异常。
statusText
这个属性用名称而不是数字指定了请求的 HTTP 的状态代码。
当状态为 200 的时候它是 “OK”，当状态为 404 的时候它是 “Not Found”。
和 status 属性一样，当 readyState 小于 3 的时候读取这一属性会导致一个异常。
timeout
超时时间，毫秒数。
5.2 方法
abort()
取消当前响应，关闭连接并且结束任何未决的网络活动。
这个方法把 XMLHttpRequest 对象重置为 readyState 为 0 的状态，并且取消所有未决的网络活动。
例如：如果请求用了太长时间，而且响应不再必要的时候，可以调用这个方法。
getAllResponseHeaders()
把 HTTP 响应头部作为未解析的字符串返回。
如果 readyState 小于 3，这个方法返回 null。否则，它返回服务器发送的所有 HTTP 响应的头部。
头部作为单个的字符串返回，一行一个头部。每行用换行符 “ ” 隔开。
getResponseHeader()
返回指定的 HTTP 响应头部的值。其参数是要返回的 HTTP 响应头部的名称。
可使用任何大小写来制定这个头部名字，和响应头部的比较是不区分大小写的。
该方法的返回值是指定的 HTTP 响应头部的值，如果没有接收到这个头部或者 readyState 小于 3 则为空字符串。
如果接收到多个有指定名称的头部，这个头部的值被连接起来并返回，使用逗号和空格分隔开各个头部的值。
open()
初始化 HTTP 请求参数。例如 URL 和 HTTP 方法，但是并不发送请求。
send()
发送 HTTP 请求，使用传递给 open() 方法的参数，以及传递给该方法的可选请求体。
setRequestHeader()
向一个打开但未发送的请求设置或添加一个 HTTP 请求。
5.3 事件监听
4个事件分别是：progress(加载进度)，load(请求完成并接受到服务器返回结果)，error(请求错误)，abort(终止请求)。
版权声明：
本文来源网络，所有图片文章版权属于原作者，如有侵权，联系删除。
本文网址：https://www.mushiming.com/mjsbk/10145.html