jsformdata对象,formdata 传对象
FormData对象
1.模拟HTML表单，相当于将HTML表单映射成表单对象，自动将表单对象中的数据拼接成请求参数的格式
2.异步上传二进制文件
1.准备HTML表单，表单中需要提交数据的表单控件必须添加name属性
2.将HTML表单转化为FormData对象，通过
3.提交表单对象
具体操作
①获取到提交表单的按钮并且给按钮添加点击事件，一旦点击就发送请求
②生成formData实例，将获取到的表单元素作为参数
③创建Ajax对象
④配置请求的方式以及地址
⑤将表单实例作为请求参数发送出去
⑥监听onload事件，当响应状态码为200时，说明请求成功，将结果打印出来即可
①formData. get ( 'key' )------用来获取表单对象的属性值，也就是输入框输入的值，key是表单的name所对应的名字
②formData. set ( 'key' ,'value')------用来设置表单对象属性的值，如果设置的表单属性存在就会覆盖原有的值，如果不存在就会创建这个属性
③formData. delete ( 'key' )-------删除表单对象的属性值
④formData. append ( 'key' ,'value')------向表单对象中添加值，如果属性已存在，那么会保留新旧两个属性及值，但是打印的话，后面添加的会覆盖前面的
①upload事件在上传文件的过程中持续触发，它又有一个onprogress方法
②已经上传的文件大小/文件的总大小*100+'%'-------- loaded (已经上传的文件大小）/ total （文件总大小）*100+'%'
③设置一个变量用来接收进度条的值，之后将值赋值给HYML样式即可
JS - FormData详解
1、将form表单元素的name与value进行组合，实现表单数据的序列化，从而减少表单元素的拼接，提高工作效率。
2、异步上传文件
1、创建一个空对象：
2、通过表单对formData进行初始化
创建表单：
通过表单元素作为参数，实现对formData的初始化：
1、通过get(key)与getAll(key)来获取相对应的值
2、通过append(key,value)在数据末尾追加数据
3、通过set(key, value)来设置修改数据
key的值不存在，会添加一条数据
key的值存在，会修改对应的value值
4、通过has(key)来判断是否存在对应的key值
5、通过delete(key)可以删除数据
创建表单：
发送数据：
FormData、Blob、Map等几个对象概念
? ? ? ?1、FormData：利用 FormData 对象，可以通过JavaScript键值对来模拟一系列表单控件，还可以使用 XMLHttpRequest的send() 方法来异步提交表单。与普通的Ajax相比，使用FormData 的最大优点就是可以异步上传二进制文件。可以先通过new关键字创建一个空的 FormData 对象，然后使用 append() 方法向该对象里添加字段（字段的值可以是一个 Blob 对象，File对象或者字符串，剩下其他类型的值都会被自动转换成字符串）。FormData对象的操作方法，全部在原型中，自己本身没任何的属性及方法。
使用formdata对象引入哪个js
利用FormData对象，可通过js用一些键值对来模拟一系列表单控件，还可以使用XMLHttpRequest的send()方法异步提交表单。
首先，在之前的“前后台交互之传参方式”中讲了传统的form表单提交的方式（表单序列化），它只适用于传递一般参数，上传文件的文件流是无法被序列化并传递的。所以，使用FormData，可以轻松的和ajax结合进行文件上传。
前端小技巧：学会用FormData对象收集表单数据
我们先看一个小例子：
html代码：
需求：是获取form表单中的用户名和密码并包装成一个对象
这个需求是我们大部分时候在发送ajax请求时需要做的一个工作。
传统JS写法：
看一下效果：
可以看到，我们已经实现了需求，但是我们写的JS代码很繁琐，我们需要先获取form表单中input框元素，然后元素的value值，最后包装成一个对象。
FormData的JS写法：
效果如下：
通过这个例子你应该能感受到FormData的便利性，只需要 new FormData(form) 一句代码就可以把form表单内的所有信息都以键值对的形式包装成一个对象返回。
FormData对象是用来将form表单数据编译成键值对，这么做有两个好处：
FormData的常用操作方法：
FormData对象可以帮我们更方便的收集表单数据并中的整理成对象，大大方便了我们发送ajax请求。