JavaScript中用reduce实现数据透视表的核心是按维度分组并聚合，即通过嵌套对象结构（如{A:{North:100,South:80}}）将扁平数组转为行列交叉表，关键在于初始化空对象、动态构建多层键路径及累加值。

JavaScript 中用 reduce 实现数据透视表，核心是按一个或多个维度分组聚合，本质是把扁平数组转为嵌套结构（如按类别汇总销售额）。关键不在“透视”二字，而在“分组 + 聚合”的逻辑封装。

明确透视目标：确定行、列、值和聚合方式

比如原始销售数据：

[ { product: 'A', region: 'North', amount: 100 }, { product: 'B', region: 'North', amount: 150 }, { product: 'A', region: 'South', amount: 80 } ]

若想得到「每产品在各区域的销售总额」，即：

{ A: { North: 100, South: 80 }, B: { North: 150 } }

那么：product 是行维度，region 是列维度，amount 是值字段，sum 是聚合函数。reduce 的初始值和累加逻辑需围绕这四要素设计。

立即学习“Java免费学习笔记（深入）”；

javascript-pro

专注现代 ECMAScript、异步编程、性能优化和全栈的 JavaScript 专家，适用于现代开发

下载

单维度分组聚合（最简起点）

先实现按 product 汇总总金额，熟悉 reduce 基本模式：

• 初始值设为 {}（空对象）
• 遍历每条记录，以 item.product 为 key 查找或初始化分组对象
• 将 item.amount 累加到对应 key 的值上

const byProduct = data.reduce((acc, item) => { acc[item.product] = (acc[item.product] || 0) + item.amount; return acc; }, {});

双维度嵌套分组（真正透视结构）

要支持 product × region 的交叉表，acc 的结构需是两层对象：

• 第一层 key 是行维度（如 product），值是对象
• 第二层 key 是列维度（如 region），值是聚合结果（如 sum）
• 每次迭代先确保外层 key 存在，再更新内层 key

const pivot = data.reduce((acc, item) => { const rowKey = item.product; const colKey = item.region; const value = item.amount; if (!acc[rowKey]) acc[rowKey] = {}; acc[rowKey][colKey] = (acc[rowKey][colKey] || 0) + value; return acc; }, {});

通用化封装：支持任意行列与聚合函数

把维度名和聚合逻辑抽离，可复用：

• 接收 rows（行字段名数组，支持多级如 ['category', 'product']）
• 接收 cols（列字段名数组）
• 接收 valueFn（取值函数，如 item => item.amount）
• 接收 reduceFn（聚合函数，如 (a, b) => a + b）
• 内部用递归或循环构建嵌套路径，避免硬编码层级

示例节选（单行单列简化版）：

function pivot(data, rowKey, colKey, valueFn, reduceFn = (a, b) => a + b) { return data.reduce((acc, item) => { const r = item[rowKey]; const c = item[colKey]; const v = valueFn(item); if (!acc[r]) acc[r] = {}; acc[r][c] = reduceFn(acc[r][c] ?? 0, v); return acc; }, {}); }