JavaScript FormData 对象常用操作方法详解

作者:小括号时间:2026-10-31 06:22:19浏览:617

本文介绍 JavaScript 中 FormData 对象的常用操作方法,包括创建实例、通过 append 添加数据、使用 get 和 getAll 获取值、利用 has 判断键是否存在以及通过 delete 删除数据,并演示如何遍历对象批量添加数据。

运行平台

操作系统为 windows11专业版

构建环境采用 vue2+element2

开发阶段需利用FormData封装数据,下文介绍其具体用法

实例化FormData

let formdata = new FormData();
//可以通过append()方法来追加数据
formdata.append("name","张三");
//通过get方法对值进行读取
console.log(formdata.get("name")); // 张三
//通过set方法对值进行修改
formdata.set("name","李四");
console.log(formdata.get("name")); // 李四
// 也可以使用遍历对象的方法来进行添加
let data = {
    name:"张三",
    age:26,
    sex:"男"
}
const formData = new FormData();
Object.keys(data).forEach((key) => {
    formData.append(key, data[key]);
});

提取对应数据值

formData.get("name"); // 获取key为name的第一个值
formData.getAll("name"); // 返回一个数组,获取key为name的所有值

校验指定 key 是否存在

let formdata = new FormData();
formdata.append("name","李四");
console.log(formdata.has("name")); // true
console.log(formdata.has("age")); // false

移除数据项

let formdata = new FormData();
formdata.append("name","李四");
console.log(formdata.get("name")); // 李四
formdata.delete("name");
console.log(formdata.get("name")); // null

本文详述了javaScript中FormData使用方法示例,更多javaScript FormData方法相关教程请参阅本站其他文章!

作者最新文章