javascript - 将对象数组分类为新数组
问题描述
我有一个数组,我需要将此数组映射到它的子数组中。
var data = [{
name: 'Cars',
content: 'BMW',
value: 2000
},
{
name: 'Cars',
content: 'Fiat',
value: 542
},
{
name: 'Cars',
content: 'Mercedes',
value: 745
},
{
name: 'Cars',
content: 'Toyota',
value: 965
},
{
name: 'Cars',
content: 'Honda',
value: 754
}, {
name: 'Cars',
content: 'VW',
value: 123
},
{
name: 'Cars',
content: 'Ford',
value: 200
},
{
name: 'Fruits',
content: 'Apple',
value: 500
}, {
name: 'Fruits',
content: 'Orange',
value: 769
}, {
name: 'Fruits',
content: 'Banana',
value: 120
}, {
name: 'Fruits',
content: 'Strawberry',
value: 48
}, {
name: 'Fruits',
content: 'Mango',
value: 653
},
{
name: 'Colors',
content: 'Red',
value: 965
}, {
name: 'Colors',
content: 'Black',
value: 931
}, {
name: 'Colors',
content: 'BMW',
value: 423
}, {
name: 'Colors',
content: 'BMW',
value: 964
}, {
name: 'Colors',
content: 'BMW',
value: 436
}
]
我想要的最终结果必须是这样的:
[
{
name: "Children Array",
children: [
{
name: "Cars",
children: [
{
name: "BMW",
value: 2000
},
{
name: "Fiat",
value: 542
},
{
...
}
]
},
{
name: "Fruits",
children: [
{
name: 'Apple',
value: 500
},
{
name: 'Orange',
value: 769
},
{
...
}
]
},
{
name: "Colors",
children: [
{
name: 'Red',
value: 965
},
{
...
}
]
}
]
}
]
这就是我所做的。
var data = [{
name: 'Cars',
content: 'BMW',
value: 2000
},
{
name: 'Cars',
content: 'Fiat',
value: 542
},
{
name: 'Cars',
content: 'Mercedes',
value: 745
},
{
name: 'Cars',
content: 'Toyota',
value: 965
},
{
name: 'Cars',
content: 'Honda',
value: 754
}, {
name: 'Cars',
content: 'VW',
value: 123
},
{
name: 'Cars',
content: 'Ford',
value: 200
},
{
name: 'Fruits',
content: 'Apple',
value: 500
}, {
name: 'Fruits',
content: 'Orange',
value: 769
}, {
name: 'Fruits',
content: 'Banana',
value: 120
}, {
name: 'Fruits',
content: 'Strawberry',
value: 48
}, {
name: 'Fruits',
content: 'Mango',
value: 653
},
{
name: 'Colors',
content: 'Red',
value: 965
}, {
name: 'Colors',
content: 'Black',
value: 931
}, {
name: 'Colors',
content: 'BMW',
value: 423
}, {
name: 'Colors',
content: 'BMW',
value: 964
}, {
name: 'Colors',
content: 'BMW',
value: 436
}
]
const layer1 = _.uniqWith(_.map(data, (item) => {
return item.name
}), _.isEqual)
const newArray = [{
name: 'Children Array',
children: _.map(layer1, (item) => {
return {
name: item,
children: _.map(data, (item) => {
return {
}
})
}
})
}]
console.log(newArray)
<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.11/lodash.js"></script>
我不知道如何处理第二个子层。
请指教。
解决方案
您可以对数据进行分组并为结果提供最终布局。
var data = [{ name: 'Cars', content: 'BMW', value: 2000 }, { name: 'Cars', content: 'Fiat', value: 542 }, { name: 'Cars', content: 'Mercedes', value: 745 }, { name: 'Cars', content: 'Toyota', value: 965 }, { name: 'Cars', content: 'Honda', value: 754 }, { name: 'Cars', content: 'VW', value: 123 }, { name: 'Cars', content: 'Ford', value: 200 }, { name: 'Fruits', content: 'Apple', value: 500 }, { name: 'Fruits', content: 'Orange', value: 769 }, { name: 'Fruits', content: 'Banana', value: 120 }, { name: 'Fruits', content: 'Strawberry', value: 48 }, { name: 'Fruits', content: 'Mango', value: 653 }, { name: 'Colors', content: 'Red', value: 965 }, { name: 'Colors', content: 'Black', value: 931 }, { name: 'Colors', content: 'BMW', value: 423 }, { name: 'Colors', content: 'BMW', value: 964 }, { name: 'Colors', content: 'BMW', value: 436 }],
result = _(data)
.groupBy('name')
.map((group, name) =>
({ name, children: _.map(group, ({ content: name, value }) => ({ name, value })) }))
.value(),
final = [{ name: "Children Array", children: result }];
console.log(final);
.as-console-wrapper { max-height: 100% !important; top: 0; }
<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.15.0/lodash.min.js"></script>
推荐阅读
- javascript - LokiJS 在模块内返回空数据库
- scapy - 如何使用 Scapy 定义具有可变数量字段的数据包?
- php - 动态添加维度到 PHP 数组
- postgresql - 在哪里可以找到 PGSQL 错误代码列表?
- python-3.x - 如何从 Networkx 最短路径算法中接收完整路径
- windows - 使用批处理脚本获取文件的绝对路径
- c# - 如何为我的 Windows 窗体应用程序项目定位多个框架?
- uwp - 将文件解压缩到 UWP C++/WinRT 中的目录
- php - 如何将双循环查询转换为 PDO?
- java - 与 Maven 的 Internet 连接被阻止