如何在JavaScript中映射含嵌套对象的数组并合并值

需求说明 #

需要将包含嵌套criteria对象的数组进行映射，最终得到以valid为键、值为合并min和max的字符串数组的新对象，同时兼容criteria: null的场景。

原代码及输出 #

原映射代码：

const res = [{
  criteria: {
    min: "25",
    max: "100"
  }
}, {
  criteria: {
    min: 0,
    max: "85"
  },
}, {
  criteria: {
    min: "10",
    max: "85"
  },
}, ].map(
  (e) => ({
    valid: e.criteria
  })
)

console.log(res)

原输出：

[
  {
    "valid": {
      "min": "25",
      "max": "100"
    }
  },
  {
    "valid": {
      "min": 0,
      "max": "85"
    }
  },
  {
    "valid": {
      "min": "10",
      "max": "85"
    }
  }
]

目标输出 #

[
  {
    "valid": ["25 - 100"]
  },
  {
    "valid": ["0 - 85"]
  },
  {
    "valid": ["10 - 85"]
  }
]

解决方案代码 #

根据更新后的上游数据规则（不会出现仅含min/max、min>max的情况，0会被保留），修改映射逻辑如下：

const res = [{
  criteria: {
    min: "25",
    max: "100"
  }
}, {
  criteria: {
    min: 0,
    max: "85"
  },
}, {
  criteria: {
    min: "10",
    max: "85"
  },
}, {
  criteria: null
}].map(e => {
  // 处理criteria为null的情况
  if (!e.criteria) {
    return { valid: [] };
  }
  // 合并min和max为指定格式的字符串，统一转为字符串避免类型问题
  const rangeStr = `${String(e.criteria.min)} - ${String(e.criteria.max)}`;
  return { valid: [rangeStr] };
})

console.log(res)

代码说明 #

• 先判断criteria是否为null/undefined，若是则返回valid: []空数组
• 对于正常的criteria对象，将min和max转为字符串后拼接成"min - max"格式的字符串，放入数组作为valid的值
• 上游已确保min和max同时存在且数值合理，无需额外处理缺失或异常情况

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