时间戳

首页 > 解决方案 > 按javascript中名为“PageName”的键的值按组从对象数组中创建一个对象

javascript - 按javascript中名为“PageName”的键的值按组从对象数组中创建一个对象

问题描述

在 javascript 输入中，按名为“PageName”的键的值按组从对象数组中创建一个对象：

[
  {"pagename": "Homepage", "key": "TITLE_HEADER", "value": "Login"},
  {"pagename": "OTPpage", "key": "NAVIGATION_TITLE", "value": "OTP"},
  {"pagename": "Homepage", "key": "SUB_HEADER", "value": "Mobile number"},
  {"pagename": "OTPPage", "key": "TITLE_HEADER", "value": "Login"},
  {"pagename": "RegisterPage", "key": "USERNAME_FIELD", "value": "User name"},
  {"pagename": "Homepage", "key": "SUB_HEADER2", "value": "emailId"},
  {"pagename": "RegisterPage", "key": "PASSWORD_FIELD", "value": "Password"}
]

需要输出：（按页面名称分组）

{
    "Homepage":{
        "TITLE_HEADER":"Login",
        "SUB_HEADER":"Mobile number",
        "SUB_HEADER2":""emailId"
    },
    "OTPpage":{
        "NAVIGATION_TITLE":"OTP",
        "TITLE_HEADER":"Login"
    },
    "RegisterPage":{
        "USERNAME_FIELD":"User name",
        "PASSWORD_FIELD":"Password"
    }

}

标签： javascriptarraysobjectecmascript-6nested-object

解决方案

那么你可以迭代它。像这样的东西：

常见forEach()解决方案：

const input = [
  {"pagename": "Homepage", "key": "TITLE_HEADER", "value": "Login"},
  {"pagename": "OTPpage", "key": "NAVIGATION_TITLE", "value": "OTP"},
  {"pagename": "Homepage", "key": "SUB_HEADER", "value": "Mobile number"},
  {"pagename": "OTPpage", "key": "TITLE_HEADER", "value": "Login"},
  {"pagename": "RegisterPage", "key": "USERNAME_FIELD", "value": "User name"},
  {"pagename": "Homepage", "key": "SUB_HEADER2", "value": "emailId"},
  {"pagename": "RegisterPage", "key": "PASSWORD_FIELD", "value": "Password"}
]

const result = {};
input.forEach(row => {
  result[row.pagename] = {...(result[row.pagename] || {}), ...{[row.key]: row.value}}
})
console.log(result);

我创建空对象result，遍历每个对象input并设置键，row.pagename而我检查是否result[row.pagename]存在||导致{}如果不存在，然后传播它{[row.key]: row.value}}导致对象合并。

如果您想使用reduce()：

let input = [
  {"pagename": "Homepage", "key": "TITLE_HEADER", "value": "Login"},
  {"pagename": "OTPpage", "key": "NAVIGATION_TITLE", "value": "OTP"},
  {"pagename": "Homepage", "key": "SUB_HEADER", "value": "Mobile number"},
  {"pagename": "OTPpage", "key": "TITLE_HEADER", "value": "Login"},
  {"pagename": "RegisterPage", "key": "USERNAME_FIELD", "value": "User name"},
  {"pagename": "Homepage", "key": "SUB_HEADER2", "value": "emailId"},
  {"pagename": "RegisterPage", "key": "PASSWORD_FIELD", "value": "Password"}
]

const result = input.reduce((accumulator, row) => {
  accumulator[row.pagename] = {...(accumulator[row.pagename] || {}), ...{[row.key]: row.value}};
  return accumulator;
}, {})

console.log(result);

推荐阅读