对接口设备状态数据归类统计的核心是解析原始结构后按status或type字段分组计数，推荐用reduce或Map高效聚合，并处理字段不统一、空数据、时间过滤等边界情况。
对接口返回的设备状态数据做归类统计，核心是先解析原始数据结构，再按状态字段（如 online、offline、error）或设备类型（如 sensor、camera、gateway）分组计数。关键在于用 Array.prototype.reduce() 或 Map 高效聚合，避免重复遍历。
明确数据结构，提取关键分类维度
先确认接口返回的数据格式。常见结构如下：
[{
"id": "dev-001",
"type": "sensor",
"status": "online",
"lastHeartbeat": "2024-06-10T08:23:15Z"
}, {
"id": "dev-002",
"type": "camera",
"status": "offline",
"lastHeartbeat": "2024-06-09T14:11:02Z"
}]
你需要决定按哪个字段归类：通常是 status（运行状态）、type（设备类型），或两者组合。如果字段名不统一（比如有的叫 state，有的叫 status），建议先用 map 统一标准化。
按单一字段统计（如 status）
用 reduce 累计每种状态出现次数：
立即学习“Java免费学习笔记（深入）”；
const statsByStatus = data.reduce((acc, device) => {
const key = device.status || 'unknown';
acc[key] = (acc[key] || 0) + 1;
return acc;
}, {});
结果示例：{ online: 12, offline: 3, error: 1, unknown: 0 }。也可以用 Map 替代普通对象，更安全（避免原型污染）：
- 初始化
const map = new Map() - 更新时用
map.set(key, (map.get(key) || 0) + 1) - 转为对象可用
Object.fromEntries(map)
按多维度交叉统计（如 type × status）
适合分析“某类设备中各状态占比”。推荐嵌套结构：
const crossStats = data.reduce((acc, device) => {
const type = device.type || 'unknown';
const status = device.status || 'unknown';
if (!acc[type]) acc[type] = {};
acc[type][status] = (acc[type][status] || 0) + 1;
return acc;
}, {});
结果形如：{ sensor: { online: 8, offline: 1 }, camera: { online: 4, error: 1 } }。后续可轻松计算百分比，例如 sensor 的在线率 = 8 / (8+1)。
补充实用技巧
实际项目中常需处理边界情况：
- 空数组或 null 数据：提前判断
if (!Array.isArray(data)) return {} - 时间敏感统计（如“最近 5 分钟在线设备”）：过滤
device.lastHeartbeat时间戳 - 需要实时响应：把统计逻辑封装成函数，配合
useEffect（React）或watch（Vue）自动重算 - 大数据量（>10k 条）：考虑用
for...of替代reduce，性能略优
不复杂但容易忽略的是字段容错和语义一致性——确保后端返回的状态值是预定义枚举，前端才好稳定归类。
