基于先前的值创建新的对象数组
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了基于先前的值创建新的对象数组相关的知识，希望对你有一定的参考价值。
我正在尝试从另一个对象数组中构建一个对象数组：
const items = [
{
id: 'thing-1',
size: {
height: 50
},
},
{
id: 'thing-2',
size: {
height: 100
}
},
{
id: 'thing-3',
size: {
height: 500
}
},
{
id: 'thing-4',
size: {
height: 200
}
}
];
这是我的预期结果：
const newList = [
{id: 'thing-1', top: 0},
{id: 'thing-2', top: 50},
{id: 'thing-3', top: 150},
{id: 'thing-4', top: 650},
];
基本上我试图找到最高位置，如果所有项目都堆叠在一起。在构建新列表时，它会计算每个项目的顶部位置（相对于项目堆栈）。因此，如果第一个项目位于堆栈顶部（从顶部开始为0）并且为50高，则第二个项目从顶部开始为50。最后一项的高度无关紧要。
我有一种感觉可以在这种情况下使用reduce，但我不确定如何在这种情况下形成语法。
我试过这样的事情，但这不太对。另外，如果我可以做到这一点，而不是在reduce的范围之外创建一个空数组，这是更可取的。
const itemsReduced = [];
items.reduce((acc, elm) => {
itemsReduced.push({id: elm.id, top: acc + elm.size.height});
return elm.size.height;
});
console.log(itemsReduced);
尝试过，但它只是导致了这一点。
[
{id: "thing-2", top: "[object Object]100"},
{id: "thing-3", top: 600},
{id: "thing-4", top: 700},
]
我正在考虑一个基本的循环，但它仍然需要在它迭代之前的项目的上下文。
答案
这是使用reduce的简单解决方案
const items = [{id: 'thing-1', size: {height: 50}},
{id: 'thing-2', size: {height: 100}},
{id: 'thing-3', size: {height: 500}},
{id: 'thing-4', size: {height: 200}}
];
var result = items.reduce((a, v) => {
a.res.push({ id: v.id, top: a.i });
a.i += v.size.height;
return a;
}, { res: [], i: 0 } ).res;
console.log(JSON.stringify(result));以上是关于基于先前的值创建新的对象数组的主要内容，如果未能解决你的问题，请参考以下文章