如何解决如何从多个嵌套值创建项目数组?
我尝试使用的数组采用以下格式(数组中可能有更多或更少的对象):
this.selected_sum_version 可以有多个组:
this.selected_sum_version.sum_item_groups = [
{
"id": 1,"name": "GROUP 1","version_id": 1,"sum_items": [
{
"id": 1,"type": "formula","sum_item_group_id": 1,"formula": {
"id": 1,"name": "Formula NAME","sum_item_id": 1
},"summary_text_Box": null,"grid": null,"chart": null
},{
"id": 4,"order": 2,"type": "text_Box","formula": null,"text_Box": {
"id": 1,"name": "Wei","sum_item_id": 4
},{
"id": 5,"order": 3,"text_Box": {
"id": 2,"name": "Lan","sum_item_id": 5
},"chart": null
}
]
},{
"id": 4,"name": "GROUP 2","sum_items": [
{
"id": 7,"order": 1,"sum_item_group_id": 4,"text_Box": {
"id": 4,"name": "JFM","sum_item_id": 7
},{
"id": 5,"name": "GROUP 3","sum_items": [
{
"id": 6,"sum_item_group_id": 5,"text_Box": {
"id": 3,"name": "JC","sum_item_id": 6
},"chart": null
}
]
}
]
this.selected_sum_version.sum_item_groups 数组中的每个对象都有一个“类型”,而“类型”只能是 4 种不同的内容:网格、图表、公式和文本框。
我需要创建一个新数组,从 newArray = [] of ALL 开始,每个对象的名称取决于类型。使用上面的示例,newArray 将是:
this.newArray = ['Formula NAME','Wei','Lan','JFM','JC'].
根据 this.selected_sum_version.sum_item_groups 中的“类型”,“公式、文本框、网格或图表”之一将不会为空,并且将具有 id、名称和 sum_item_id。我需要 newArray 是所有这些名称的数组。
我在下面编写的代码适用于该目的,但是编写的效率不高。有没有更直接、更简洁的写法?
var emptyArray = [];
this.selected_sum_version.sum_item_group.forEach(element => {
elementtwo.sum_items.forEach(elementthree => {
if (elementthree.type === 'formula') {
newArray.push(elementthree.formula.name);
} else if(elementthree.type === 'grid') {
newArray.push(elementthree.grid.name);
} else if(elementthree.type === 'chart') {
newArray.push(elementthree.chart.name);
} else if(elementthree.type === 'text_Box') {
newArray.push(elementthree.text_Box.name);
}
});
});
解决方法
我没有测试下面的代码,但看起来你可以直接使用 type
中的值,而不是先检查值。
this.selected_sum_version.sum_item_group.forEach(element => {
elementtwo.sum_items.forEach(elementthree => {
newArray.push(elementthree[elementthree.type].name);
});
});
,
这并不比您的方式更有效,但代码会更简洁一些。
var emptyArray = [];
var types = new Set(['formula','grid','chart','text_box']);
this.selected_sum_version.sum_item_group.forEach(element => {
elementtwo.sum_items.forEach(el => {
if (types.has(el.type)) {
newArray.push(el[el.type].name);
}
}
}
编辑:此答案假定您不想添加到数组中的类型。如果您想添加名称而不考虑类型,则不需要 set 或 types.has
检查。
这是使用 reduce、map、Nullish coalescing operator 和 optional chaining 的简洁代码实现这一目标的最佳方法
const result = sum_item_groups.map(({ sum_items }) =>
sum_items.map(
(obj) =>
obj.formula?.name ??
obj.text_box?.name ??
obj.grid?.name ??
obj.chart?.name
)
);
console.log(result.flat());
const sum_item_groups = [
{
id: 1,name: "GROUP 1",version_id: 1,sum_items: [
{
id: 1,type: "formula",sum_item_group_id: 1,formula: {
id: 1,name: "Formula NAME",sum_item_id: 1,},summary_text_box: null,grid: null,chart: null,{
id: 4,order: 2,type: "text_box",formula: null,text_box: {
id: 1,name: "Wei",sum_item_id: 4,{
id: 5,order: 3,text_box: {
id: 2,name: "Lan",sum_item_id: 5,],{
id: 4,name: "GROUP 2",sum_items: [
{
id: 7,order: 1,sum_item_group_id: 4,text_box: {
id: 4,name: "JFM",sum_item_id: 7,{
id: 5,name: "GROUP 3",sum_items: [
{
id: 6,sum_item_group_id: 5,text_box: {
id: 3,name: "JC",sum_item_id: 6,];
const result = sum_item_groups.map(({ sum_items }) =>
sum_items.map(
(obj) =>
obj.formula?.name ??
obj.text_box?.name ??
obj.grid?.name ??
obj.chart?.name
)
);
console.log(result.flat());
或
const result = sum_item_groups.reduce((acc,{ sum_items }) => {
const values = sum_items.map((obj) => {
return ( obj.formula?.name ?? obj.text_box?.name ?? obj.grid?.name ?? obj.chart?.name);
});
return [...acc,...values];
},[]);
console.log(result);
const sum_item_groups = [
{
id: 1,];
const result = sum_item_groups.reduce((acc,[]);
console.log(result);
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。