FormData和serialize的区别

FormData 的作用和 jQuery中的 serialize() 作用一样，用于快速收集表单数据
并且可以将创建的 FormData对象直接提交给接口

serialize
serialize()是JQuery方法，必须依赖jQuery，
serialize() 方法通过序列化表单值，创建 URL 编码文本字符串。
您可以选择一个或多个表单元素（比如 input 及/或 文本框），或者 form 元素本身。
序列化的值可在生成 AJAX 请求时用于 URL 查询字符串中。

缺点：只能序列化一般数据，文件上传则无法序列化，不支持文件二进制流提交

FormData
基本使用方法：
假设需要收集 …… 里面的所有表单项的值
要求，每个表单元素都具有 name 属性

注意事项：

提交 FormData 对象，不能使用 GET 方式，具体以接口文档为准

formdata是一个二进制数据，在控制台无法直接打印输出 ，创建的 FormData对象可以直接提交给接口。

只有涉及到文件上传的接口，后台才会以formdata的方式进行处理

// 1. 获取 form 标签的 DOM对象
	let form = document.querySelector('form');
	// 2. 实例化 FormData 对象，传入 form
	let fd = new FormData(form);
	// 3. 提交数据
	axios.post('/api/formdata', fd).then(result => {	// formdata接口直接传入fd就行
	    console.log(result);
	})
	// 但不是每个后台接口都接收formdata，只传数据不传文件
	// 所以需要用到遍历forEach，添加到一个新建的对象中
	let data = {}
	  // value:值
	  // key:键
	  // 将formdata转换为对象
	  fd.forEach(function(value, key) {
	    data[key] = value
	  })
	  console.log(data)

在提交数据前，可以使用下列API方法对数据进行查看和修改

append('key', 'value'); // 向对象中追加数据
set('key', 'value');    // 修改对象中的数据
delete ('key');         // 从对象中删除数据
get('key')              // 获取指定key的一项数据
getAll('key')           // 获取指定key的全部数据，返回一个数组
forEach()               // 遍历对象中的数据

FormData和serialize的区别

共同点：
都需要设置表单各项的name属性。
都能快速收集表单数据
都能够获取到隐藏域（）的值
都不能获取禁用状态（disabled）的值

不同点：
FormData属于原生的代码；serialiaze是jQuery封装的方法
FormData可以收集文件域（）的值，而serialize不能。如果有文件上传，则必须使用FormData。
得到的结果的数据类型不一样