formdata 必须传入 form 元素才能采集字段，否则为空；转查询字符串需用 urlsearchparams；不支持嵌套对象和文件上传；append 空值会被丢弃；字段顺序与编码需实际验证。
FormData 构造函数必须传入 form 元素，否则是空的
直接 new FormData() 不会自动采集页面上任何表单字段——它就是一个空容器。只有传入有效的 <form></form> DOM 元素，才会按规范提取所有“成功控件”（有 name、未 disabled、且被选中的 input/select/textarea）。
常见错误：const fd = new FormData() 后调用 fd.get('username') 返回 undefined，不是数据丢了，是根本没初始化。
- ✅ 正确写法：
const fd = new FormData(document.querySelector('form')) - ⚠️ 注意：
disabled的字段、没写name的字段、radio未选中项，都会被跳过 - 调试建议：用
[...fd.entries()]或fd.getAll('hobby')看真实内容，别只靠console.log(fd)
想转成查询字符串？必须过 URLSearchParams
FormData 本身不是字符串，也不是 JSON 对象，它是一个二进制友好的传输载体。formData.toString() 永远返回 [object FormData]，毫无意义。
真正要得到 key=value&key2=value2 格式，唯一干净做法是用 URLSearchParams 转换：
const form = document.getElementById('myForm');
const fd = new FormData(form);
const params = new URLSearchParams(fd);
console.log(params.toString()); // → "name=Alice&age=30&hobby=%E7%AF%AE%E7%90%83"
- ✅ 自动处理多选：
<select name="hobby" multiple></select>选两项，输出就是hobby=篮球&hobby=足球 - ✅ 自动
encodeURIComponent，中文、空格、特殊字符全安全 - ❌ 不支持文件上传——如果
fd里含File，URLSearchParams会跳过该字段（不报错，但字段消失）
嵌套对象字段（如 user[name]）不会自动解析成结构
浏览器把 name="user[name]" 当作纯字符串键，new FormData(form) 得到的是 {"user[name]": "Alice"}，不是 {user: {name: "Alice"}}。所有方括号或点号语法都是人为约定，需前后端配合解析。
如果你用 Object.fromEntries(fd)，结果仍是扁平对象；同名 key（如多个 items[0].id）还会覆盖，只剩最后一个值。
- ✅ 真正传嵌套结构：前端先
JSON.stringify({user: {name: 'Alice'}})，塞进隐藏域：<input type="hidden" name="payload" value="..."> - ✅ 后端收
req.body.payload后再JSON.parse() - ❌ 别指望
URLSearchParams(fd).toString()输出能被后端直接映射为对象——它只是字符串，比如user[nickname]=Bob&user[age]=25 - ⚠️ 框架差异大：Express 默认不解析
[]，得配urlencoded({ extended: true })；Laravel 和 Django 原生支持，PHP$_POST也支持，但 Node.js 原生querystring不支持
append() 传空值会被静默丢弃
formData.append('email', null)、formData.append('email', '')、formData.append('email', undefined) —— 这些调用后，后端根本收不到 email 字段。这不是 bug，是规范行为。
尤其容易踩坑的是布尔值和日期：
- 布尔值别直接传：
formData.append('active', isActive)会发"true"或"false"字符串，后端常无法识别；应写成formData.append('active', isActive ? '1' : '0') - 日期推荐用
date.toISOString()，比date.toString()更稳定 - 文件上传必须用
File实例，不能用input.value（那是空字符串或文件名） - 混合提交时字段顺序敏感：某些后端（如 Express + multer）依赖物理顺序，建议先 append 文件，再 append 文本字段
复杂点在于：你看到的表单结构，和最终 HTTP 请求体里的字段排列、编码、重复键处理方式，可能完全不同。别凭直觉猜，每次改逻辑都用 [...fd.entries()] 和抓包验证一次。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
