如何使用underscorejs对嵌套对象进行分组并获取匹配的数据长度

Question

如何对对象数组中的匹配数据进行分组，并获取匹配数据长度来取平均值。

var getdataObj = [{
  "finalUrl": "https://www.amazon.in/",
  "fetchTime": "2022-10-15T08:58:18.485Z",
  "audits": {   
    "first-contentful-paint": {
      "displayValue": "1.2"
    },
    }
},
{
  "finalUrl": "https://www.google.in/",
  "fetchTime": "2022-11-15T08:58:18.485Z",
  "audits": {   
    "first-contentful-paint": {
      "displayValue": "6.2"
    },
    }
},
{
  "finalUrl": "https://www.flipkart.in/",
  "fetchTime": "2022-10-15T08:58:18.485Z",
  "audits": {   
    "first-contentful-paint": {
      "displayValue": "4.2"
    },
    }
},
{
  "finalUrl": "https://www.amazon.in/",
  "fetchTime": "2022-10-15T08:58:18.485Z",
  "audits": {   
    "first-contentful-paint": {
      "displayValue": "3.7"
    },
    }
},
{
  "finalUrl": "https://www.google.in/",
  "fetchTime": "2022-12-15T08:58:18.485Z",
  "audits": {   
    "first-contentful-paint": {
      "displayValue": "3.2"
    },
    }
}]

这是我得到的对象数组。如何在这里对匹配元素进行分组。

• 需要对匹配的URL进行分组
• 根据月份和年份分隔值。

预期结果：

https://www.amazon.in/ 月 : 2022-10 总值：4.9 //(1.2+3.7)

我的代码逻辑：

var groupedData = _.chain(getdataObj)
          .groupBy('fetchTime')
          .map(function (group, datekey) {
          return {
              Month: datekey.substr(0,7),
                WTs: _.chain(group)
                  .groupBy("finalUrl")
                  .map(function (group, key) {
                  return {
                      WT: key,
                     TotalWeight: _.reduce(group, function(acc, i){ 
                          acc.speed += parseFloat(i['audits']['first-contentful-paint']['displayValue']);                         
                          return acc; 
                      }, {speed : 0})
                  };
              })
              .value()
          }})
          .value();

我需要得到长度。例如：我在 10 月份有 3 个数据。所以我的平均计算应该是，

https://www.amazon.in/ 月 : 2022-10

https://www.flipkart.in/ 月 : 2022-10

总价值：9.1 / 3 => 3.03

谁能帮我解决这个问题。

我在这里添加的示例小提琴：JSFiddle

var data = [{
    fetchTime: '2022-12-15T08:58:18.485Z',
    finalUrl: 'https://www.amazon.in/',
    audits: {
        "first-contentful-paint": {
        "displayValue": "3.4"
    },
    "largest-contentful-paint": {
      "displayValue": "2.3"
    },
    }
}, {
    fetchTime: '2022-12-15T08:58:18.485Z',
    finalUrl: 'https://www.google.in/',
    audits: {
    "first-contentful-paint": {
        "displayValue": "1.2"
    },
    "largest-contentful-paint": {
      "displayValue": "3.4"
    },
    }
}, {
    fetchTime: '2023-02-15T08:58:18.485Z',
    finalUrl: 'https://www.amazon.in/',
    audits: {
    "first-contentful-paint": {
        "displayValue": "6.2"
    },
    "largest-contentful-paint": {
      "displayValue": "3.5"
    },
    }
}, {
    fetchTime: '2022-11-15T08:58:18.485Z',
    finalUrl: 'https://www.flipkart.in/',
    audits: {
    "first-contentful-paint": {
        "displayValue": "4.2"
    },
    "largest-contentful-paint": {
      "displayValue": "5.3"
    },
    }
}, {
    fetchTime: '2023-01-15T08:58:18.485Z',
    finalUrl: 'https://www.google.in/',
    audits: {
    "first-contentful-paint": {
        "displayValue": "7.2"
    },
    "largest-contentful-paint": {
      "displayValue": "8.3"
    },
    }
}];

var groupedData = _.chain(data)
    .groupBy('fetchTime')
    .map(function (group, key) {
    return {
        Month: key,
        WTs: _.chain(group)
            .groupBy("finalUrl")
            .map(function (group, key) {
            return {
                WT: key,
                TotalWeight: _.reduce(group, function(acc, i){ 
                    acc.speed += parseFloat(i['audits']['first-contentful-paint']['displayValue']);
                    acc.large += parseFloat(i['audits']['largest-contentful-paint']['displayValue']);
                }, {speed:0, large:0})
            };
        })
        .value()
    }})
    .value();


console.log(groupedData);

_.each(groupedData, function(m) {
    console.log("Month: ", m.Month);
    _.each(m.WTs, function(wt) {
        console.log("  ", wt.WT,  ": ", wt.TotalWeight);
    });
});

Answer 1

您可以采用组合键进行分组并将

displayValue

添加到

total

.

const
    data = [{ finalUrl: "https://www.amazon.in/", fetchTime: "2022-10-15T08:58:18.485Z", audits: { "first-contentful-paint": { displayValue: "1.2" } } }, { finalUrl: "https://www.google.in/", fetchTime: "2022-11-15T08:58:18.485Z", audits: { "first-contentful-paint": { displayValue: "6.2" } } }, { finalUrl: "https://www.flipkart.in/", fetchTime: "2022-10-15T08:58:18.485Z", audits: { "first-contentful-paint": { displayValue: "4.2" } } }, { finalUrl: "https://www.amazon.in/", fetchTime: "2022-10-15T08:58:18.485Z", audits: { "first-contentful-paint": { displayValue: "3.7" } } }, { finalUrl: "https://www.google.in/", fetchTime: "2022-12-15T08:58:18.485Z", audits: { "first-contentful-paint": { displayValue: "3.2" } } }],
    result = Object.values(data.reduce((r, { finalUrl, fetchTime, audits: { ["first-contentful-paint"]: { displayValue } } }) => {
        const
            month = fetchTime.slice(0, 7),
            key = [finalUrl].join('|');
            
        r[key] ??= { finalUrl, month, total: 0 };
        r[key].total += +displayValue;
        
        return r;
    }, {}));

console.log(result);

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