React中过滤二维数组获取指定tagClass.code对象的代码修正

原二维数组 #

const maintemp = [
[
    {
    equipId: 1,
    name: '1메인 온도 센서',
    sensors: [
        {
        tagId: 11,
        name: '온도',
        value: 28.8,
        tagClass: {
            bitCalcYn: 'N',
            code: 'INNERTEMP',
            encoding: 'ONEDECIMALPOINT',
            isDigital: 'N',
        },
        },
    ],
    },
    {
    equipId: 2,
    name: '1메인 습도 센서',
    sensors: [
        {
        tagId: 22,
        name: '습도',
        value: 50.3,
        tagClass: {
            bitCalcYn: 'N',
            code: 'INNERAHUM',
            encoding: 'ONEDECIMALPOINT',
            isDigital: 'N',
            name: '실내 습도',
        },
        },
    ],
    },
],

[
    {
    equipId: 3,
    name: '2메인 온도 센서',
    sensors: [
        {
        tagId: 11,
        name: '온도',
        value: 28.8,
        tagClass: {
            bitCalcYn: 'N',
            code: 'INNERTEMP',
            encoding: 'ONEDECIMALPOINT',
            isDigital: 'N',
        },
        },
    ],
    },
    {
    equipId: 4,
    name: '2메인 습도 센서',
    sensors: [
        {
        tagId: 22,
        name: '습도',
        value: 50.3,
        tagClass: {
            bitCalcYn: 'N',
            code: 'INNERAHUM',
            encoding: 'ONEDECIMALPOINT',
            isDigital: 'N',
            name: '실내 습도',
        },
        },
    ],
    },
],
];

用户错误代码 #

const fill = maintemp.filter((v) =>
  v.filter((hi) => hi.sensors[0].tagClass.code === "INNERTEMP'")
);

问题分析 #

1. 外层filter逻辑错误：filter回调需要返回布尔值，但内层v.filter返回的是数组，非空数组会被视为true，导致外层数组的所有子数组都被保留，无法筛选出单个equip对象。
2. 数组结构处理错误：原数组是二维结构，需要先将其扁平化，才能直接遍历所有equip对象。
3. 语法错误：字符串引号不匹配（"INNERTEMP'），会导致代码报错。
4. 传感器判断不严谨：直接取sensors[0]假设每个equip只有一个传感器，若后续结构变化会导致逻辑失效。

修正后的代码 #

方案1：使用flat()扁平化数组（现代环境支持） #

const fill = maintemp.flat().filter(equip => 
  equip.sensors.some(sensor => sensor.tagClass.code === 'INNERTEMP')
);

方案2：兼容旧环境的扁平化方式 #

const fill = [].concat(...maintemp).filter(equip => 
  equip.sensors.some(sensor => sensor.tagClass.code === 'INNERTEMP')
);

代码说明 #

• 先将二维数组扁平化，把所有equip对象放到一个一维数组中。
• 用filter筛选出满足条件的equip对象：通过some检查该equip的sensors数组中是否存在tagClass.code为INNERTEMP的传感器，避免依赖固定索引。
• 修正了引号不匹配的语法问题，统一使用单引号。

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