js中[{id:1,name:['hh','bb'],age:['1','22']},{id:2,name:'dd',age:'33'}]怎么变成[{id:1,name:'hh',age:'1'},{id:1,name:'bb',age:'22'},{id:2,name:'dd',age:'33'}]
时间: 2023-08-06 14:15:50 浏览: 112
你可以使用Array.flatMap()方法来实现这个需求。
Array.flatMap()方法在ECMAScript 2019中被引入,它可以将一个数组中的每个元素通过一个映射函数映射为一个新数组,并将所有新数组平铺到一个新数组中。因此,我们可以使用Array.flatMap()方法来将原始数组中的每个对象展开成多个新对象。
在映射函数中,我们首先将当前对象的name和age属性转换为数组,然后使用map()方法将每个元素映射为一个新的对象。新对象中的id键值与原始对象中的id相同,而name和age键值则分别为原始对象中对应键值的每个元素。
```
var arr = [{id:1,name:['hh','bb'],age:['1','22']},{id:2,name:'dd',age:'33'}];
var result = arr.flatMap(function(obj) {
var nameArr = obj.name instanceof Array ? obj.name : [obj.name];
var ageArr = obj.age instanceof Array ? obj.age : [obj.age];
return nameArr.map(function(name, index) {
return { id: obj.id, name: name, age: ageArr[index] };
});
});
console.log(result);
// [{id: 1, name: "hh", age: "1"}, {id: 1, name: "bb", age: "22"}, {id: 2, name: "dd", age: "33"}]
```
在上面的代码中,我们直接使用flatMap()方法将原始数组展开为多个新对象,并将结果赋值给result变量。在映射函数中,我们首先将name和age属性转换为数组,然后使用map()方法将每个元素映射为一个新的对象,最后将所有新对象平铺到一个数组中。
这样,结果数组中的每个对象都只有一个name和一个age属性。
阅读全文
相关推荐


















