在数组中深度查找 object 并编辑然后放回原处

Question

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

each item can have children and objects in a children)

when will click to edit the function should give finded object by key or by given object:

findObj(3) //find by key

//result {name: "item3", key: 3}

when will click to save after the editing the edited object should be saved in own place:

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

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

Answer 1

Find item by key

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 }

Save item by key

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

Just some rough solutions. You should be able to customize it from there.

Answer 2

/** * @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 }