如何用Lodash按itemId、颜色、尺寸分组数组统计商品各店数量及总和

实现思路 #

• 先扁平化原始嵌套数据，给每个商品挂载所属店铺ID，解决原始数据中items是二维数组的嵌套问题
• 以itemId + '|' + itemColor + '|' + itemSize作为唯一分组键，对所有商品做聚合
• 提前提取所有店铺ID列表，保证每个分组都能补全所有店铺的数量，无数据时默认赋值0
• 遍历每个分组，统计各店铺对应数量、计算总数量，输出目标格式数据

完整实现代码 #

const _ = require('lodash');

// 传入原始店铺商品数据
function statShopItem(originData) {
  // 1. 提取所有店铺ID列表
  const shopIds = _.map(originData, '_id');

  // 2. 扁平化所有商品，挂载所属店铺ID
  const allItems = _.flatMap(originData, shop => {
    // 把二维的items拍平成一维
    const shopItems = _.flatten(shop.items);
    return _.map(shopItems, item => ({
      ...item,
      shopId: shop._id
    }));
  });

  // 3. 按三个字段分组
  const groupedItems = _.groupBy(allItems, item => `${item.itemId}|${item.itemColor}|${item.itemSize}`);

  // 4. 组装目标格式数据
  const result = _.map(groupedItems, group => {
    // 取分组内第一条的公共属性（同分组的name、color、size肯定一致）
    const baseInfo = {
      itemName: group[0].itemName,
      color: group[0].itemColor,
      size: group[0].itemSize
    };
    // 统计各店铺数量
    const shopCount = _.reduce(shopIds, (acc, shopId) => {
      const findItem = _.find(group, { shopId });
      acc[shopId] = findItem ? findItem.itemCount : 0;
      return acc;
    }, {});
    // 计算总数量
    const sum = _.sumBy(group, 'itemCount');
    return {
      ...baseInfo,
      ...shopCount,
      sum
    };
  });

  return result;
}

// 测试示例数据
const testData = [
  {
    "_id": "shop 1",
    "items": [
      [
        {
          "itemId": "111",
          "itemColor": "red",
          "itemSize": "xxl",
          "itemCount": 1,
          "itemName": "example name 1"
        },
        {
          "itemId": "222",
          "itemColor": "green",
          "itemSize": "xl",
          "itemCount": 1,
          "itemName": "example name 2"
        }
      ]
    ]
  },
  {
    "_id": "shop 2",
    "items": [
      [
        {
          "itemId": "111",
          "itemColor": "red",
          "itemSize": "xxl",
          "itemCount": 3,
          "itemName": "example name 1"
        },
        {
          "itemId": "222",
          "itemColor": "blue",
          "itemSize": "L",
          "itemCount": 1,
          "itemName": "example name 2"
        }
      ]
    ]
  }
];

console.log(statShopItem(testData));

输出结果验证 #

运行上述代码输出的结构和期望的表格格式完全对应：

[
  {
    itemName: 'example name 1',
    color: 'red',
    size: 'xxl',
    'shop 1': 1,
    'shop 2': 3,
    sum: 4
  },
  {
    itemName: 'example name 2',
    color: 'green',
    size: 'xl',
    'shop 1': 1,
    'shop 2': 0,
    sum: 1
  },
  {
    itemName: 'example name 2',
    color: 'blue',
    size: 'L',
    'shop 1': 0,
    'shop 2': 1,
    sum: 1
  }
]

内容的提问来源于stack exchange，提问作者Bob