在数组中深度查找对象并编辑然后放回原位答案

【问题标题】：Deep find object in array and edit then put back in place在数组中深度查找对象并编辑然后放回原位
【发布时间】：2021-05-31 11:07:54
【问题描述】：

const data = [{name: "item1", key: 1}, {name: "item2", key: 2, children: [{name: "item3", key: 3}]}]

每个项都可以有子项和子项中的对象）

什么时候点击编辑功能应该通过键或给定对象给出找到的对象：

findObj(3) //按键查找

//结果 {name: "item3", key: 3}

编辑后什么时候点击保存编辑后的对象应该保存在自己的位置：

saveEditing({name: "editedName", key: 3})

//结果 [{name: "item1", key: 1}, {name: "item2", key: 2, children: [{name: "editedName", key: 3}]}]

【问题讨论】：

你已经尝试了什么？
klediooo 还没有

标签： javascript arrays function object filter

【解决方案1】：

/**
 * @param {Number} key 
 * @param {Array} array 
 * @returns {Object}
 */
function findObj(key, array) {
  for (const item of array) {
    if (item.key === key) {
      return item
    } 
    else if (item.children) {
      const foundChildren = findObj(key, item.children)
      if (foundChildren) return foundChildren
    }
  }
  return null
}

/**
 * @param {Object} obj 
 * @param {Array} array 
 * @returns Boolean
 */
function saveEditing(obj, array) {
  const foundObj = obj.key && findObj(obj.key, array)
  if (foundObj) {
    Object.assign(foundObj, {...obj})
    return true
  }
  return false
}

【讨论】：

【解决方案2】：

按键查找项目

function findItemByKey(data, key){
  for(let node of data){
    if(node.key === key){
      return node;
    }
    if(node.children){
      let result = findItemByKey(node.children, key)
      if(result) {
        return result;
      }
    }
  }
  return undefined;
}

let result = findItemByKey(data, 3);
console.log(result); // { name: "item3", key: 3 }

按键保存项目

function saveItemByKey(data, key, name){
  let result = findItemByKey(data, key);
  if(result){
    result.name = name;
  }
}

只是一些粗略的解决方案。您应该可以从那里自定义它。

【讨论】：