如何同时过滤和映射数组？

Question

我试图安排数据输入到重新图表中。不确定如何正确地重新排列数据。重新图表为我测试过的线条图提供了这种结构：

data = [
    {
      name: '2017-01-01', gr: 4000, hv: 2400
    },
    {
      name: '2017-01-02', gr: 3000, hv: 1398
    },
    {
      name: '2017-01-03', gr: 2000, hv: 9800
    }
  ];

我有一个json文件，需要将其重新排列成类似的格式：

[
    {
      "Month/Year": "2019-09",
      "group": "blue",
      "flights": "668620"
    },
    {
        "Month/Year": "2019-10",
        "group": "blue",
        "flights": "662520"
    },
    {
        "Month/Year": "2019-09",
        "group": "green",
        "flights": "662520"
    },
    {
        "Month/Year": "2019-10",
        "group": "green",
        "flights": "678520"
    }
]

我试图通过对数据的映射来处理数据：

processData = (data) => {
    return data.map(e => ({
      name: e['Month/Year'],
      gr: e[THIS WOULD BE green IN group],
      hv: e[THIS WOULD BE blue IN group]
    }));
  };

期望的结果：

data = [
    {
      name: '2019-09', gr: 662520, hv: 668620
    },
    {
      name: '2019-10', gr: 678520, hv: 662520
    }
  ];

我相信我必须以某种方式过滤，将数据转换成适当的格式。有人能给我指明正确的方向吗？谢谢。

Answer 1

您可以使用一个哈希表并从中获取值。

​

var data = [{ "Month/Year": "2019-09", group: "blue", flights: "668620" }, { "Month/Year": "2019-10", group: "blue", flights: "662520" }, { "Month/Year": "2019-09", group: "green", flights: "662520" }, { "Month/Year": "2019-10", group: "green", flights: "678520" }],
    result = Object.values(data.reduce((r, o) => {
        var name = o["Month/Year"];
        r[name] = r[name] || { name };
        r[name][{ green: 'gr', blue: 'hv'}[o.group]] = o.flights;
        return r;
    }, {}));

console.log(result);

.as-console-wrapper { max-height: 100% !important; top: 0; }

​

Answer 2

您必须确定JSON['group']，以获得正确的JSON['flights']值设置。

将其与当前减少的结果进行查找，您可以在它们到达时更新值或添加新项。

​

var rawData = [
  { "Month/Year": "2019-09", "group": "blue",  "flights": "668620" },
  { "Month/Year": "2019-10", "group": "blue",  "flights": "662520" },
  { "Month/Year": "2019-09", "group": "green", "flights": "662520" },
  { "Month/Year": "2019-10", "group": "green", "flights": "678520" }
];

console.log(processData(rawData));

function processData(data) {
  return data.reduce((result, item, index) => {
    let found = result.find(d => d.name === item['Month/Year']);
    if (found) {
      Object.assign(found, {
        gr : item['group'] === 'green' ? item['flights'] : found.gr,
        hv : item['group'] === 'blue' ? item['flights'] : found.hv
      });
    } else {
      result.push({
        name : item['Month/Year'],
        gr   : item['group'] === 'green' ? item['flights'] : null,
        hv   : item['group'] === 'blue'  ? item['flights'] : null,
      });
    }
    return result;
  }, []);
}

.as-console-wrapper { top: 0; max-height: 100% !important; }

​

动态示例

​

var rawData = [
  { "Month/Year": "2019-09", "group": "blue",  "flights": "668620" },
  { "Month/Year": "2019-10", "group": "blue",  "flights": "662520" },
  { "Month/Year": "2019-09", "group": "green", "flights": "662520" },
  { "Month/Year": "2019-10", "group": "green", "flights": "678520" }
];

console.log(processData(rawData, 'Month/Year', {
  gr : (item) => item['group'] === 'green' ? item['flights'] : null,
  hv : (item) => item['group'] === 'blue' ? item['flights'] : null
}));

function processData(data, key, mappers) {
  return data.reduce((result, item, index) => {
    let found = result.find(d => d.name === item[key]);
    if (found) {
      Object.keys(mappers).forEach(key => found[key] = mappers[key](item) || found[key]);
    } else {
      result.push(Object.keys(mappers).reduce((obj, key) => {
        return Object.assign(obj, { [key] : mappers[key](item) })
      }, { name : item[key] }));
    }
    return result;
  }, []);
}

.as-console-wrapper { top: 0; max-height: 100% !important; }

​

Answer 3

这是一个非常简单的方法。这与波利维尔先生在我更正后的回答非常相似。

​

var newData = [];
var data = [{
    "Month/Year": "2019-09",
    "group": "blue",
    "flights": "668620"
  },
  {
    "Month/Year": "2019-10",
    "group": "blue",
    "flights": "662520"
  },
  {
    "Month/Year": "2019-09",
    "group": "green",
    "flights": "662520"
  },
  {
    "Month/Year": "2019-10",
    "group": "green",
    "flights": "678520"
  }
];

data.forEach((item, index) => {
    let temp = {};
    let exists = newData.find(e => e.name === item['Month/Year']);
    if (exists) { // if the date exists in the array already
	if (item.group === 'green') {
            exists.gr = item.flights;
        } else {
    	    exists.hv = item.flights;
	}
    } else {
        temp.name = item['Month/Year'];
        if (item.group === 'green') {
            temp.gr = item.flights;
        } else {
    	    temp.hv = item.flights;
	}
        newData.push(temp);
    }
});

console.log(newData);

.as-console-wrapper { max-height: 100% !important; top: 0; }

​