How can I print a specific part of a JSON object with JavaScript?

Question

I would like to know what to use to transform the document from JSON to an array and the print the part of the array the user wants. Also, how can I put it in an HTML document so the user can search any part of the array.

Below is the JSON .

 { "A": { "1": { "1\º": [ "Semestre 1" ] }, "2": { "1\º": [ "Semestre 1" ] } }, "B": [ ], "c": { "2": { "1\º": [ "Semestre 1" ] }, "3": { "1\º": [ "Semestre 1" ] }, "44": { "1\º": [ "Semestre 1" ] }, "G6": { "1\º": [ "Semestre 1" ] }, "GP98": { "1\º": [ "Semestre 1" ] }, "654": { "1\º": [ "Semestre 1" ] }, "5556": { "1\º": [ "Semestre 1" ] }, "7654": { "1\º": [ "Semestre 1" ] } } } 

Thanks for your help.

Answer 1

Depending on what you want your strings/collection of strings to look like you can do one of the below options.

JSON.Stringify will convert a JavaScript object or value to a JSON string.

printDataWithStringify = (x) => {
  console.log(JSON.stringify(data[x]))
}

> {"1":{"1º":["Semestre 1"]},"2":{"1º":["Semestre 1"]}}

If you want to go even further, you can try the below code.

var printedStrings = []

checkNestedData = (x, y) => {

  if (typeof(x[y]) === 'object' && !Array.isArray(x[y][property1])) {
    printedStrings.push(y)
    for (var property1 in x[y]) {
      checkNestedData(x[y], property1)
    }
  } else {
    printedStrings.push(x[y]);
  }

}


printDataWithKeysAndValues = (x) => {
  var part = data[x]
  for (var property1 in part) {
    checkNestedData(part, property1)
  }
  console.log(printedStrings)
}

> 1,1º,Semestre 1,2,1º,Semestre 1

The above code utilizes a for...in loop which is used to loop through JavaScript objects. part is the object you get when you retrieve information from data at the key of x (in this case, "A" ). property1 represents the key for the current object ( part ) and is the iterator for the for...in loop as we loop through part .

To take it even further, checkNestedData checks to see if there is another object nested in the current object. If it's an object (that doesn't have a array for a child), you push y (remember this is the key ( property1 ) from the original loop) into the intialized printedStrings array. Then perform another loop and you run checkNestedData recursively on the current iterative in the new loop.

This recursive callback will run until the last child is not a populated object.

Once we've looped through the entire object, storing the keys and values we've extracted from the object (including nested objects) we simply console.log the final array which contains all of our keys and value from that portion ( "A" ) of data.

Depending on how you want the string to be formatted, you can append/remove things from the strings via interpolation or concatenation. But this solution should get you every key and value and store them as a string in an array.

 var data = { "A": { "1": { "1\º": [ "Semestre 1" ] }, "2": { "1\º": [ "Semestre 1" ] } }, "B": [ ], "c": { "2": { "1\º": [ "Semestre 1" ] }, "3": { "1\º": [ "Semestre 1" ] }, "44": { "1\º": [ "Semestre 1" ] }, "G6": { "1\º": [ "Semestre 1" ] }, "GP98": { "1\º": [ "Semestre 1" ] }, "654": { "1\º": [ "Semestre 1" ] }, "5556": { "1\º": [ "Semestre 1" ] }, "7654": { "1\º": [ "Semestre 1" ] } } } printDataWithStringify = (x) => { console.log('STRINGIFY: ' + JSON.stringify(data[x])) } var printedStrings = [] checkNestedData = (x, y) => { if (typeof(x[y]) === 'object' && !Array.isArray(x[y][property1])) { printedStrings.push(y) for (var property1 in x[y]) { checkNestedData(x[y], property1) } } else { printedStrings.push(x[y]); } } printDataWithKeysAndValues = (x) => { var part = data[x] for (var property1 in part) { checkNestedData(part, property1) } console.log('ALL KEYS AND VALUES: ' + printedStrings) } printDataWithStringify("A") printDataWithKeysAndValues("A")