在JS数组中创建对象

Question

我目前正在尝试在Javascript中创建这个数组内的嵌套对象，我不确定如何进行更深层次的

我目前得到这个结构，它有name和start_date级别:

{"Todd":
{
"dates":
{
"05/12/2021":
[
"123",
"ABC"
]
}
}
}

但是我想要的结构将进一步按区域进入日期级别，然后按区域内的作业，像这样:

{"Todd":
{
"dates":
{
"05/12/2021":
{
"zones":
{
"ABC":
[
"job_1"
]
"123":
[
"job_2"
]
}
}
}
}
}

我将如何改变对象，因为它目前站在创建这两个级别的日期级别?

new Vue({
el: "#app",
props: { 
},
data: {
rows: [
{  
name: "Todd",
job: "job_1",
start_date: "05/12/2021",
zone: "123",
hours: 37,
awards: 12
},
{  
name: "Todd",
job: "job_2",
start_date: "05/12/2021",
zone: "ABC",
hours: 20,
awards: 8
}
],
},
computed: {
//Keeping grouped data as object instead of flattening so that we can lookup later. Also tracking total here
numbersByName() {
return this.rows.reduce((obj,show) => {
name = show.name,
zone = show.zone,
job = show.job,
date = show.start_date,
nameDate = obj[name] = obj[name] || {dates: {} },
dates = nameDate.dates,
date = dates[date] = dates[date] || [];
date.push(zone);
return obj 
}, {})
},
}
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>
<div id="app">
{{numbersByName}}
</div>

Answer 1

也许像这样的东西可以做:

const nest = (rows) =>
rows .reduce (
(a, row) => {
const name = a [row .name] || (a [row .name] = {dates: {}})
const date = name .dates [row .start_date] || (name .dates [row .start_date] = {zones: {}})
const zone = date .zones [row .zone] || (date .zones [row .zone] = [])
zone .push (row .job)
return a
},
{}
)

new Vue({
el: "#app",
props: { },
data: {rows: [
{name: "Todd", job: "job_1", start_date: "05/12/2021", zone: "123", hours: 37, awards: 12},
{name: "Todd", job: "job_2", start_date: "05/12/2021", zone: "ABC", hours: 20, awards: 8}
]},
computed: {
numbersByName() {return nest(this.rows)},
}
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>
<div id="app">
{{numbersByName}}
</div>

我将nest移到外部函数中，因为我认为它更容易作为独立函数进行推理和测试。

我们简单地通过创建name,date和zone字段(如果它们还不存在)将输入数组折叠到输出中，并在运行时将它们附加到正确的父字段。然后我们将job推入zone。

如果语法不清楚:

const name = a [row .name] || (a [row .name] = {dates: {}})

是

的简写

let name = a [row .name]
if (!(name)) {
name = {dates: {}}
a [row.name] = name
}

接下来的三行是类似的