javascript - 通过比较两个数组基于索引映射键
问题描述
我有两个数组。
const headers = ['Cars', 'Fruits', 'Food'];
const data = [{
group: 'Cars',
name: 'BMW',
value: '25641'
}, {
group: 'Fruits',
name: 'Apple',
value: '45876'
},
{
group: 'Cars',
name: 'Benz',
value: '65784'
},
{
group: 'Cars',
name: 'Toyota',
value: '254'
},
{
group: 'Food',
name: 'Pizza',
value: '87535'
},
{
group: 'Cars',
name: 'Honda',
value: '65796'
},
{
group: 'Fruits',
name: 'Banana',
value: '98631'
},
{
group: 'Fruits',
name: 'Orange',
value: '87563'
},
{
group: 'Food',
name: 'Burger',
value: '78324'
},
{
group: 'Fruits',
name: 'Mango',
value: '24598'
}
]
我需要映射它们以达到这样的结果:
const newArray = [{
id: '11',
parent: '01',
name: 'BMW',
value: '25641'
}, {
id: '21',
parentId: '02',
name: 'Apple',
value: '45876'
},
{
id: '12',
parentId: '01',
name: 'Benz',
value: '65784'
},
{
id: '13',
parentId: '01'
name: 'Toyota',
value: '254'
},
{
id: '31',
parentId: '03',
name: 'Pizza',
value: '87535'
},
{
id: '14',
parentId: '01',
name: 'Honda',
value: '65796'
},
{
id: '22',
parentId: '02',
name: 'Banana',
value: '98631'
},
{
id: '23',
parentId: '02',
name: 'Orange',
value: '87563'
},
{
id: '32',
parentId: '03',
name: 'Burger',
value: '78324'
},
{
id: '24',
parentId: '02',
name: 'Mango',
value: '24598'
}
]
目前我正在尝试这个。它适用于第一个数组,但不适用于第二个数组。请指教。
const headers = ['Cars', 'Fruits', 'Food'];
const data = [{
group: 'Cars',
name: 'BMW',
value: '25641'
}, {
group: 'Fruits',
name: 'Apple',
value: '45876'
},
{
group: 'Cars',
name: 'Benz',
value: '65784'
},
{
group: 'Cars',
name: 'Toyota',
value: '254'
},
{
group: 'Food',
name: 'Pizza',
value: '87535'
},
{
group: 'Cars',
name: 'Honda',
value: '65796'
},
{
group: 'Fruits',
name: 'Banana',
value: '98631'
},
{
group: 'Fruits',
name: 'Orange',
value: '87563'
},
{
group: 'Food',
name: 'Burger',
value: '78324'
},
{
group: 'Fruits',
name: 'Mango',
value: '24598'
}
]
const chart2ndLayer = _.map(data, (itemB, indexB) => {
const parentIndex = headers.indexOf(itemB.group);
return {
id: `${parentIndex + 1}${indexB + 1}`,
parent: `0${parentIndex + 1}`,
value: parseInt(itemB.value, 10),
name: itemB.name
};
});
console.log(chart2ndLayer)
<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.11/lodash.min.js"></script>
id 按顺序排列,但我希望它基于索引。请指教。
解决方案
const headers = ['Cars', 'Fruits', 'Food'];
const data = [{
group: 'Cars',
name: 'BMW',
value: '25641'
}, {
group: 'Fruits',
name: 'Apple',
value: '45876'
},
{
group: 'Cars',
name: 'Benz',
value: '65784'
},
{
group: 'Cars',
name: 'Toyota',
value: '254'
},
{
group: 'Food',
name: 'Pizza',
value: '87535'
},
{
group: 'Cars',
name: 'Honda',
value: '65796'
},
{
group: 'Fruits',
name: 'Banana',
value: '98631'
},
{
group: 'Fruits',
name: 'Orange',
value: '87563'
},
{
group: 'Food',
name: 'Burger',
value: '78324'
},
{
group: 'Fruits',
name: 'Mango',
value: '24598'
}
]
const createNewArray = (data, headers) => {
const GROUP_INDEX = {};
return data.map((object) => {
if (!GROUP_INDEX[object.group]) {
GROUP_INDEX[object.group] = 0;
}
GROUP_INDEX[object.group]++;
const parentIndex = headers.indexOf(object.group);
return {
id: `${parentIndex + 1}${GROUP_INDEX[object.group]}`,
parent: `0${parentIndex + 1}`,
value: parseInt(object.value, 10),
name: object.name
}
})
}
/* const chart2ndLayer = _.map(data, (itemB, indexB) => {
const parentIndex = headers.indexOf(itemB.group);
return {
id: `${parentIndex + 1}${indexB + 1}`,
parent: `0${parentIndex + 1}`,
value: parseInt(itemB.value, 10),
name: itemB.name
};
});
console.log(chart2ndLayer)
*/
console.log(createNewArray(data, headers));
通过相关性保留索引的 hashmap 方法
推荐阅读
- reactjs - 在 jsx 组件内添加一个变量
- php - 使用关系将一个模块的名称列出到另一个模块的编辑部分
- java - 在同一事务中同步更改的实体
- python - 在 Tkinter 窗口大小更改中导入 pywinauto 时
- perl - 使用端口(例如 localhost:12345)访问 IPv6 可解析 URL 会导致 Strawberry Perl 5.30.1 中的错误地址
- python-3.x - 在 P4Python 中撤消更改列表
- html - 由于评论,TemplateDoesNotExist 错误
- java - java Stack Trace中打印的问号(?)符号
- sql - 表中空列和非空列的案例表达式
- intellij-idea - IntelliJ 添加 Java 11