在前端开发中，我们经常需要使用表单来向后端传递数据，而表单数据有多种类型，比如键值对、文件等。在传输过程中，需要将这些数据序列化并且编码为一定的格式，比如 URL 编码、multipart/form-data 等。npm 包 form-data-set 提供了一种便捷的方式来构造并编码表单数据，本文将详细介绍其使用方法。
安装
使用 npm 命令来安装 form-data-set：
npm install form-data-set
使用方法
form-data-set 有两种方式来构造表单数据：
- 通过传入键值对对象来构造表单数据。
- 通过传入 FormData 对象来构造表单数据。
构造键值对表单数据
form-data-set 的 set 方法可以用来设置表单数据，参数为表单字段名和对应值：
const { FormData } = require('form-data-set');
const formData = new FormData();
formData.set('name', 'Jack');
formData.set('age', 20);除了基本类型的值，还可以设置数组和对象：
formData.set('colors', ['red', 'green', 'blue']);
formData.set('address', {
province: 'Guangdong',
city: 'Shenzhen'
});此时表单数据已经构造完成，但是需要将其编码为字符串格式，在发送请求时才能正确地传递到后端。form-data-set 提供了 encode 方法来完成此任务：
const encodedFormData = formData.encode(); console.log(encodedFormData); // name=Jack&age=20&colors[]=red&colors[]=green&colors[]=blue&address[province]=Guangdong&address[city]=Shenzhen
该字符串即为序列化后的表单数据，可以将其加入请求体中，发往后端。
构造 FormData 对象表单数据
如果已经使用了 FormData 对象来上传文件，那么直接使用该对象来构造表单数据是最方便的。form-data-set 提供了 from 方法来完成该工作：
-- -------------------- ---- ------- ----- - -------- - - ------------------------- ----- -------- - --- ----------- ------------------------- -------------------------------------------- ----------------------- -------- ---------------------- ---- ----- ----------- - ------------------------ ----- --------------- - --------------------- ----------------------------- -- -------------------- ---------- -------------- --------------------- -- ------------- --------- -- -- ------- ----- -- -------------------- ---------- ----------- -- -- ---- -- -------------------- ---------- ---------- -- -- --
此时，表单数据已经包含了 FormData 对象中的所有数据，也可以通过 encode 方法来获取序列化后的表单数据。需要注意，这种情况下 encode 方法返回的是一个 Buffer 对象，发送请求时需要将其作为请求体发送。
结语
form-data-set 是一个方便的 npm 包，可以帮助我们快速构造表单数据，并将其编码为正确的格式。本文介绍了它的基本用法，希望能对读者在实际项目中的开发有所帮助。完整示例代码可在 GitHub 上获取：https://github.com/BoltDoggy/npm-form-data-set-tutorial。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/5ef0b4b4efcef77a054b760b