使用Lodash groupby和map变换对象数组

时间:2018-10-24 05:44:52

标签: javascript lodash

这是我想要做的,我想获取以下数组并将其转换为后面的数组。谁能指出我正确的方向?

原始数据

[{
        "FeatureId": 1,
        "District": "ANE",
        "Temperature": 206,
        "RelativeHumidity": 20,
        "WindSpeed": 5,
        "WindGust": 15
      },
      {
        "FeatureId": 1,
        "District": "ANE",
        "Temperature": 196,
        "RelativeHumidity": 19,
        "WindSpeed": 5,
        "WindGust": 15
      },
      {
        "FeatureId": 2,
        "District": "AMO",
        "Temperature": 203,
        "RelativeHumidity": 54,
        "WindSpeed": 9,
        "WindGust": 18
      },
      {
        "FeatureId": 2,
        "District": "AMO",
        "Temperature": 184,
        "RelativeHumidity": 46,
        "WindSpeed": 12,
        "WindGust": 18
      }]

我想要的数据:

[
  {
    "FeatureId": 1,
    "District": "ANE",
    "TemperatureTrend": [ 206, 196 ],
    "RelativeHumidityTrend": [ 20, 19 ],
    "WindSpeedTrend": [ 5, 5 ],
    "WindGustTrend": [ 15, 15 ]
  },
  {
    "FeatureId": 2,
    "District": "AMO",
    "TemperatureTrend": [ 203, 184 ],
    "RelativeHumidityTrend": [ 54, 46 ],
    "WindSpeedTrend": [ 9, 12 ],
    "WindGustTrend": [ 18, 18 ]
  },

]

我尝试结合使用groupby和map,但是无法解决该问题。我也不确定如何记录这些步骤。

3 个答案:

答案 0 :(得分:3)

除了其他好的答案之外,您还可以使用es6解构。

var arr = [{
            "FeatureId": 1,
            "District": "ANE",
            "Temperature": 206,
            "RelativeHumidity": 20,
            "WindSpeed": 5,
            "WindGust": 15
          },
          {
            "FeatureId": 1,
            "District": "ANE",
            "Temperature": 196,
            "RelativeHumidity": 19,
            "WindSpeed": 5,
            "WindGust": 15
          },
          {
            "FeatureId": 2,
            "District": "AMO",
            "Temperature": 203,
            "RelativeHumidity": 54,
            "WindSpeed": 9,
            "WindGust": 18
          },
          {
            "FeatureId": 2,
            "District": "AMO",
            "Temperature": 184,
            "RelativeHumidity": 46,
            "WindSpeed": 12,
            "WindGust": 18
          }]

var temp = arr.reduce((o, d) => (
              { WindSpeed, WindGust, RelativeHumidity, Temperature, ...rest } =
                    ({ 
                       ...d
    		      , ...{ 
		          RelativeHumidityTrend:  (o[d.FeatureId] && o[d.FeatureId].RelativeHumidityTrend || []).concat(d.RelativeHumidity)
		       	  , WindSpeedTrend:  (o[d.FeatureId] && o[d.FeatureId].WindSpeedTrend || []).concat(d.WindSpeed)
     	       		  , WindGustTrend:  (o[d.FeatureId] && o[d.FeatureId].WindGustTrend || []).concat(d.WindGust) 
                          , TemperatureTrend:  (o[d.FeatureId] && o[d.FeatureId].TemperatureTrend || []).concat(d.Temperature)
			}
    		})
    	        , o[d.FeatureId] = rest
   	        , o
    	   ) , {})
              
    var result = Object.values(temp)
    console.log(result)

答案 1 :(得分:2)

让我们使用Array.prototype.reduce是因为它符合您要执行的操作的目的。

    const data = [{
        "FeatureId": 1,
        "District": "ANE",
        "Temperature": 206,
        "RelativeHumidity": 20,
        "WindSpeed": 5,
        "WindGust": 15
      },
      {
        "FeatureId": 1,
        "District": "ANE",
        "Temperature": 196,
        "RelativeHumidity": 19,
        "WindSpeed": 5,
        "WindGust": 15
      },
      {
        "FeatureId": 2,
        "District": "AMO",
        "Temperature": 203,
        "RelativeHumidity": 54,
        "WindSpeed": 9,
        "WindGust": 18
      },
      {
        "FeatureId": 2,
        "District": "AMO",
        "Temperature": 184,
        "RelativeHumidity": 46,
        "WindSpeed": 12,
        "WindGust": 18
      }]

// we gonna create from scratch array and populate it
const aggregatedData = data.reduce((memo, element) => {
  const featureId = element.FeatureId

  const elementIndex = memo.findIndex(el => el.FeatureId === featureId)
  if (elementIndex === -1) {
    memo.push({
      FeatureId: featureId,
      District: element.District,
      TemperatureTrend: [element.Temperature],
      RelativeHumidityTrend: [element.RelativeHumidity],
      WindSpeedTrend: [element.WindSpeed],
      WindGustTrend: [element.WindGust]
    })
  } else {
    memo[elementIndex].TemperatureTrend.push(element.Temperature)
    memo[elementIndex].RelativeHumidityTrend.push(element.RelativeHumidity)
    memo[elementIndex].WindSpeedTrend.push(element.WindSpeed)
    memo[elementIndex].WindGustTrend.push(element.WindGust)
  }

  return memo
}, [])

console.log(aggregatedData)

You can check it in codepen

答案 2 :(得分:0)

基督徒,欢迎来到StackOverflow!

您有一个有趣的,多步骤的逻辑问题。我假设每个FeatureId可能不止2个,事实上,我假设FeatureId的1 ... n范围之内。

我将首先使用forEach循环来创建所有唯一FeatureId值的数组。然后,现在知道这些值是什么,我将使用JavaScript's filter创建一个新数组,该数组仅包含具有相同FeatureId的那些对象。

由于这些“工作数组”中的所有元素都具有相同的FeatureId,因此结合对象的最后一步将变得更加容易。如果只有一个观察对象,则可以将现有对象推到最终的成品阵列上。如果存在> 1个观察对象,则可以使用合并逻辑并将新的串联对象推入最终的成品阵列中。

您使用lodash映射的想法朝着正确的方向发展,但是1)看看是否可以在不使用Lodash的情况下进行操作; 2)我认为将filter和forEach结合使用会更好。