用一些数组键格式化对象

Question

它从我的数据库中获得了一个特定的结果，我如下所示：

const data = {
short: 'en',
element: {
'dsdsea-22dada-2ffgd-xxada-eeee': { name: 'test name', comment: 'test comment' },
'adad2a-dda13-dsdad-wwwwd-adaxx': { name: 'name 2' },
}

我想应用JavaScript操作来获得以下结果：

[
{
short: 'en',
key: "dsdsea-22dada-2ffgd-xxada-eeee.name"
value: "test name"
},
{
short: 'en',
key: "dsdsea-22dada-2ffgd-xxada-eeee.comment"
value: "test comment"
},
{
short: 'en',
key: "adad2a-dda13-dsdad-wwwwd-adaxx.name"
value: "name 2"
}
]

我尝试过使用Object.entries和map函数的组合，但我不知道如何处理单个元素对象中的双键。

Answer 1

这可能是实现所需目标的一种可能的解决方案。

它使用Object.entries()、.map()、.flatMap()和使用反勾"字符的模板文字。

代码段

const getTransformedArray = obj => (
Object.entries(obj.element)   // iterate over 'element' key-value pairs
.flatMap(([k1, v1]) => (      // k1-v1 where v1 is object (with name, comment props)
Object.entries(v1)          // iterate over v1's key-value pairs
.map(([k2, v2]) => ({       // map each iteration
short: obj.short,         // create the resulting object
key: `${k1}.${k2}`,       // 'key' is created using k1, k2
value: v2                 // 'value' is v2 as-is
}))
))                            // '.flatMap' used above avoids nesting of arrays
);
const data = {
short: 'en',
element: {
'dsdsea-22dada-2ffgd-xxada-eeee': { name: 'test name', comment: 'test comment' },
'adad2a-dda13-dsdad-wwwwd-adaxx': { name: 'name 2' }
}
};
console.log(getTransformedArray(data));

解释

上面代码片段中的内联注释解释了代码是如何工作的。

编辑

答案更新为使用.flatMap()，如@pilchard所强调的。

Answer 2

您需要两个循环来迭代每个element，然后迭代这些元素的每个值。

这里，在每个属性的Object.entries()上使用for...of循环，在每个级别进行析构以将相关名称应用于每个属性，然后使用模板文字创建复合key值

const data = {
short: 'en',
element: {
'dsdsea-22dada-2ffgd-xxada-eeee': { name: 'test name', comment: 'test comment' },
'adad2a-dda13-dsdad-wwwwd-adaxx': { name: 'name 2' },
}
}
const result = [];
for (const [key, element] of Object.entries(data.element)) {
for (const [prop, value] of Object.entries(element)) {
result.push({ short: data.short, key: `${key}.${prop}`, value })
}
}
console.log(result)

Answer 3

你可以做：

const data = {short: 'en',element: {'dsdsea-22dada-2ffgd-xxada-eeee': {name: 'test name',comment: 'test comment'},'adad2a-dda13-dsdad-wwwwd-adaxx': {name: 'name 2'}}}
const result = Object
.entries(data.element)
.reduce((a, [key, obj]) => [
...a,
...Object
.values(obj)
.map(value => ({
...{
short: data.short,
key
},
value
}))
], [])
console.log(result)

Answer 4

使用Object.keys()获取element中的键，然后使用键映射返回的数组以访问每个元素对象，从而获取名称。以下是完整的代码片段：

const input = {
short: 'en',
element: {
'dsdsea-22dada-2ffgd-xxada-eeee': { name: 'test name', comment: 'test comment' },
'adad2a-dda13-dsdad-wwwwd-adaxx': { name: 'name 2' },
},
};
function format(data = {}) {
const { short = '', element = {} } = data;
let result = Object.keys(element).map((key) => {
return Object.values(element[key]).map((value) => ({ short, key, value }));
});
result = result.flat();
return result;
}
const result = format(input);
console.log(result)

这个打印：

[
{
"short": "en",
"key": "dsdsea-22dada-2ffgd-xxada-eeee",
"value": "test name"
},
{
"short": "en",
"key": "dsdsea-22dada-2ffgd-xxada-eeee",
"value": "test comment"
},
{
"short": "en",
"key": "adad2a-dda13-dsdad-wwwwd-adaxx",
"value": "name 2"
}
]