Filtering and appending in JSON?

Question

I have a JSON variable in React like this:

var newTreeData_2 = {
      name: current_name,
      img: current_img,
      uuid: uuid.v4(),
      children: [
        {
          name: "Edit and save",
          img:
            "https://cdn3.iconfinder.com/data/icons/harmonicons-06/64/plus-circle-512.png",
          uuid: uuid.v4()
        },
        {
          name: "add a new one",
          img:
            "https://cdn3.iconfinder.com/data/icons/harmonicons-06/64/plus-circle-512.png",
          uuid: uuid.v4()
        }
      ]
    };

Each uuid.v4() is a unique ID.

What I want to do is to make a function which takes in a UUID, and should append a new object children:[{}] to where the UUID is located at. For example, if **my uuid matches the uuid.v4() on line 10 of the code snippet, it should append a JSON object so the end result looks like:

  var newTreeData_2 = {
          name: current_name,
          img: current_img,
          uuid: uuid.v4(),
          children: [
            {
              name: "Edit and save",
              img:
                "https://cdn3.iconfinder.com/data/icons/harmonicons-06/64/plus-circle-512.png",
              uuid: uuid.v4(), 
              chilren: [{}]

            },
            {
              name: "add a new one",
              img:
                "https://cdn3.iconfinder.com/data/icons/harmonicons-06/64/plus-circle-512.png",
              uuid: uuid.v4()
            }
          ]
        };

Answer 1

As I understand it, you want to add an object if the child's uuid is equal to a given uuid.

If that's what you want, you can loop through each child, test if it's uuid is equal to the given uuid, and if it is, add [{}] .

function addJSONObjct(obj, uuid) {
    for (i = 0; i < obj.children.length; i ++) {
       if (obj.children[i].uuid === uuid) {
            obj.children[i].children=[{}];
       }
    }
}

Answer 2

this recursive function find object with target UUID and add children to them

 var newTreeData = { name: 'a', img: 'b', uuid: 1234, children: [{ name: "Edit and save", img: "https://cdn3.iconfinder.com/data/icons/harmonicons-06/64/plus-circle-512.png", uuid: 12345, children: [{ name: "Edit and save", img: "https://cdn3.iconfinder.com/data/icons/harmonicons-06/64/plus-circle-512.png", uuid: 123 }] }, { name: "add a new one", img: "https://cdn3.iconfinder.com/data/icons/harmonicons-06/64/plus-circle-512.png", uuid: 132456 } ] }; function findUUID(targetObject, uuid) { var children = targetObject.children; if (!!children === false) return; var target = children.filter(x => { if (x.uuid === uuid) return x; }); if (target.length === 0) { children.map(x => findUUID(x, uuid)); } else { if (!!target[0].children && target[0].children.length !== 0) { target[0].children.push({}); console.log(target); } else { target[0].children = [{}]; console.log(target); } } } findUUID(newTreeData, 132456); 

Answer 3

The exact code i have to solve this problem:

  findUUID(targetObject, uuid2, name, img, details) {
var targetIsFound = false;
var target = "";
console.log("Parent TreeData UUID" + targetObject.uuid);
console.log("UUID we are trying to match" + uuid2);
if (targetObject.uuid == uuid2) {
  targetIsFound = true;
  target = targetObject;
}

console.log(targetIsFound, target);
if (targetIsFound == false) {
  console.log(
    "About to start recursion, this is the target Object: ",
    targetObject
  );
  if (targetObject.children === undefined) {
    console.log("we should exit here");
  } else {
    targetObject.children.map(x => this.findUUID(x, uuid2));
  }
} else {
  if (target.name == "Edit and save") {
    target.children = [
      {
        name: "Edit and save",
        img:
          "https://cdn3.iconfinder.com/data/icons/harmonicons-06/64/plus-circle-512.png",
        uuid: uuid.v4()
      },
      {
        name: "Edit and save",
        img:
          "https://cdn3.iconfinder.com/data/icons/harmonicons-06/64/plus-circle-512.png",
        uuid: uuid.v4()
      }
    ];
  }
  this.setState({ treeData: this.state.treeData });
  console.log(this.state.treeData);
}
}

name, img and details are just parameters to fill the data with the uuids matched. The reason I named the matching uuid "uuid2" is because I imported the uuid package and there can be conflicts.

Jeff and Barzin's code work, If your data is like mine you have to run recursion on Jeff's method. My code is different from Barzin's in that I am doing an error check: if(targetObject.children === undefined) to make sure I don't continue to perform recursion if there is nothing to perform it with. By the way, this method puts assumption that the UUID we are trying to find definitely exists in targetObject.