首页 > 解决方案 > Javascript 对象转换

问题描述

数据数组有 3 个对象,每个对象有 3 个键,即 key、c​​ity 和 fair。现在我想以这样一种方式进行析构,即城市和公平被隔离在单独的 JS 对象中(如下所示)

我怎样才能进行这样的转换?

输入

const data = [
  {
    "key": 1,
    "city": "Delhi",
    "fair": 4500
  },
  {
    "key": 2,
    "city": "Ahmedabad",
    "fair": 2500
  },
  {
    "key": 3,
    "city": "Mumbai",
    "fair": 5000
  }
];

预期产出

const city = [
  {
    "key": 1,
    "value": "Delhi"
  },
  {
    "key": 1,
    "value": "Ahmedabad"
  },
  {
    "key": 1,
    "value": "Mumbai"
  }
];

const fair = [
  {
    "key": 1,
    "value": 4500
  },
  {
    "key": 1,
    "value": 2500
  },
  {
    "key": 1,
    "value": 5000
  }
];

标签: javascriptarraysjsonobject

解决方案


您可以使用Array#reduce()调用将每个属性累积到一个单独的数组中。

如果您事先知道要分组的键,则可以在初始累加器中声明它们并显式调用它们。

const input = [{ "key": 1, "city": "Delhi", "fair": 4500 }, { "key": 2, "city": "Ahmedabad", "fair": 2500 }, { "key": 3, "city": "Mumbai", "fair": 5000 }];

const { city, fair } = input.reduce((acc, { key, city, fair }) => {
  acc.city.push({ key, value: city });
  acc.fair.push({ key, value: fair });

  return acc;
}, { city: [], fair: [] });

console.log(city);
console.log(fair);
.as-console-wrapper { max-height: 100% !important; top: 0; }

但是如果你有大量的属性,你可能需要一个更动态的选项,在这里分离key和迭代Object.entries()任何剩余的属性,并在累加器中按键对它们进行分组。

const input = [{ "key": 1, "city": "Delhi", "fair": 4500 }, { "key": 2, "city": "Ahmedabad", "fair": 2500 }, { "key": 3, "city": "Mumbai", "fair": 5000 }];

const { city, fair } = input.reduce((acc, { key, ...data }) => {
  Object.entries(data).forEach(([prop, value]) => {
    (acc[prop] ??= []).push({ key, value });
  });
  return acc;
}, {});

console.log(city);
console.log(fair);
.as-console-wrapper { max-height: 100% !important; top: 0; }


推荐阅读