如何将迭代器（FormData）转换为对象

Question

给定一个form元素new FormData(form)返回一个迭代器。

// [["key1", "val1"],["key2", "val2"]]
console.log([new FormData(form)...])

我现在想将其转换为以下形式的对象：

{ "key1": "val1", "key2": "val2" }

使用 ES6/7 特性（babel 支持）。

如果可以在功能方法中做到这一点，有什么想法吗？

Answer 1

您可以.reduce使用 spread ...运算符生成的数组

[...new FormData(document.querySelector('form'))].reduce((o, [k, v]) => {
    o[k] = v;
    return o;
}, {}); // Object {"key1": "val1", "key2": "val2"}

Answer 2

你可以使用for..of循环

 var formData = new FormData(); formData.append("a", 123); formData.append("b", 456); var obj = {}; for(let prop of formData) {obj[prop[0]] = prop[1]}; console.log(obj)

---

或者，使用rest element ， FormData() ，它返回一个Iterator ， Array.prototype.forEach() 。

 var formData = new FormData(); formData.append("a", 123) formData.append("b", 456) var res = (d, it = [...d], r = {}, t =!(it.forEach(([k, v]) => {r[k] = v}))) => r; console.log(res(formData))

Answer 3

您可以简单地定义一个对象并循环遍历迭代器以从中获取值并将其分配给您创建的对象。

var fd = new FormData(someForm);
po = {};
for (var key of fd){
  po[key] = fd[key];
}

Answer 4

使用功能方式

function getFormObj(form) {

 return  [...new FormData(form)].reduce((prev, [key,val]) => {
    return Object.assign(prev, {[key] : val}) ; 
  }, {}) ; 
}

Answer 5

这是一个老问题，但最近我认为可以使用以下方法解决（以防万一有人发现它有用）：

let fd = new FormData(form)...
console.log(Array.from(fd.entries()))

Answer 6

您可以使用Object.fromEntries(iterable);

从文档：

参数：

iterable - 一个可迭代对象，例如 Array 或 Map 或其他实现可迭代协议的对象。

返回值：

一个新对象，其属性由可迭代的条目给出。

描述：

Object.fromEntries()方法采用键值对列表并返回一个新对象，其属性由这些条目给出。 iterable 参数应该是一个实现@@iterator方法的对象，它返回一个迭代器对象，它产生一个类似数组的二元素对象，其第一个元素是一个将用作属性键的值，其第二个元素是与该属性键关联的值。

 const formData = new FormData(); formData.append("a", 111); formData.append("b", 222); formData.append("c", 333); console.log(Object.fromEntries(formData))