JavaScript 依据匹配键更新JSON并组装生成新JSON的实现方法

核心逻辑拆解 #

• 输入源结构：a为固定顺序的步骤集合，每个元素是单键值对对象，存储步骤名和初始状态；b为接口返回的业务记录数组，每条记录的Stage字段值对应a中的某个步骤名
• 更新规则：对每条业务记录，定位Stage字段对应的步骤在a中的下标位置，将数组开头到该位置（含位置本身）的所有步骤状态替换为complete，位置之后的步骤保留原有值；最终将处理后的步骤集合作为Stages字段挂载到业务记录下，移除原Stage字段生成输出。

实现步骤 #

• 预构建a的步骤名-下标映射表，将步骤位置查找的时间复杂度从O(n)降至O(1)，减少重复遍历开销
• 遍历b数组的每一条业务记录，取出当前记录的目标步骤值，从映射表中拿到对应的目标下标
• 对原始a数组做隔离拷贝（不直接修改源数组，避免多次处理时的数据源污染），逐条目判断：若条目对应的下标 <= 目标下标，就把状态替换为complete，否则保留原始值
• 组装最终的业务记录结构，将处理后的步骤数组作为Stages字段挂载，剔除原Stage字段

完整可运行代码 #

// 原始输入（与示例保持一致）
const a = [{"a":"Not Started"},{"b":"Not Started"},{"c":"Not Started"},{"d":"Not Started"},{"e":"Not Started"}]
const b = [{"Id":1, "Stage":"c"}]

// 构建步骤名与对应下标的映射
const stageIndexMap = a.reduce((map, stageItem, index) => {
  const stageKey = Object.keys(stageItem)[0]
  map[stageKey] = index
  return map
}, {})

// 生成最终输出
const result = b.map(item => {
  const targetStage = item.Stage
  // 兜底处理：匹配不到目标步骤时将下标设为-1，所有步骤保留初始状态
  const targetIndex = stageIndexMap[targetStage] ?? -1

  // 逐条目处理步骤状态，生成新数组不修改源数据
  const processedStages = a.map(originStageItem => {
    const stageKey = Object.keys(originStageItem)[0]
    const currentIndex = stageIndexMap[stageKey]
    return {
      [stageKey]: currentIndex <= targetIndex ? 'complete' : originStageItem[stageKey]
    }
  })

  // 组装目标结构
  return {
    Id: item.Id,
    Stages: processedStages
  }
})

运行上述代码得到的result与示例期望输出完全一致：

[
  {"Id":1, "Stages":[{"a":"complete"},{"b":"complete"},{"c":"complete"},{"d":"Not Started"},{"e":"Not Started"}]}
]

实现注意事项 #

• 不要直接修改原始的a数组，否则后续处理其他b记录时会出现状态错乱
• 兜底逻辑要覆盖Stage值匹配不到的场景，避免出现targetIndex为undefined导致的比较逻辑错误
• 若后续a的条目结构升级为嵌套对象，需将当前的浅拷贝替换为深拷贝逻辑，避免内存引用问题

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