TypeScript中如何查找并更新嵌套对象数组的指定属性值

核心思路 #

先把所有需要修改checked属性的ID统一收集到集合中，再通过DFS遍历原嵌套树匹配ID更新属性即可，步骤如下：

1. 提取触发节点的自身ID和它的_children数组里的所有子ID，存入Set实现O(1)效率的匹配查找
2. 递归遍历原嵌套树形结构，每遍历一个节点就判断ID是否在目标集合中，匹配则将checked设为false

代码实现 #

/**
 * 更新嵌套树中指定节点的checked属性为false
 * @param tree 原嵌套树形数据
 * @param triggerNode 触发变更的节点对象（即你给出的第二个对象）
 */
function updateNodeChecked(tree: any, triggerNode: any) {
  // 收集所有需要更新的ID
  const targetIdSet = new Set<string>()
  targetIdSet.add(triggerNode.id)
  triggerNode._children.forEach((childId: string) => targetIdSet.add(childId))

  // DFS遍历更新
  const traverse = (node: any) => {
    // 匹配ID则更新checked
    if (node.id && targetIdSet.has(node.id)) {
      node.checked = false
    }
    // 递归遍历子节点
    if (Array.isArray(node.children) && node.children.length) {
      node.children.forEach(traverse)
    }
  }

  // 兼容根节点是数组的场景
  if (Array.isArray(tree)) {
    tree.forEach(traverse)
  } else {
    traverse(tree)
  }
}

// 调用示例
// const yourSecondObj = { ... } // 你给出的第二个包含_children的对象
// updateNodeChecked(data, yourSecondObj)

说明 #

• 用Set存储目标ID可自动去重，查找效率远高于数组遍历
• 递归逻辑兼容任意层级的嵌套结构，不会漏匹配深层节点
• 仅修改符合条件节点的checked属性，不会改动其他字段的值

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