JavaScript中表单转JSON后无法访问属性的问题咨询

你犯了一个典型的错误：把FormData转成对象后立刻用JSON.stringify()转成了JSON字符串，此时body是字符串类型而非JavaScript对象。字符串没有firstName、service这类属性，所以访问时返回undefined，修改属性也不会产生任何效果。

先把FormData转为JavaScript对象，完成属性的访问和修改后，再根据需求转成JSON字符串。

修正后的代码：

let formData = new FormData(thisForm).entries();
// 先转成JS对象，不要立刻转字符串
let bodyObj = Object.fromEntries(formData);

// 现在可以正常访问属性
console.log(bodyObj.firstName); // 输出Arnab
console.log("service=" + bodyObj.service); // 输出service=OTT

// 正常修改属性
bodyObj.service = "hello";

// 如果需要JSON字符串（比如接口请求），再转换
let bodyStr = JSON.stringify(bodyObj);
console.log(bodyStr); // 此时输出的JSON字符串里service已改为hello

• Object.fromEntries(formData)返回的是JavaScript普通对象，可以直接操作它的属性
• JSON.stringify()的作用是把JS对象转成JSON格式的字符串，字符串仅用于传输或存储，无法直接操作属性
• 只有当你需要把数据发给后端、或者存储到localStorage这类地方时，才需要转成JSON字符串

内容的提问来源于stack exchange，提问作者Arnab Maiti