Indexing through JSON array

Question

I am trying to index through a JSON list in JavaScript but I'm having quite a lot of trouble getting it to work.

I have tried indexing through the values of each JSON item but it's not outputting what I want. I think I can get it to work but that would be with an extra unnecessary for loop level. Here is my JSON: https://pastebin.com/iYmaA4c5. If you think it would be better to reformat the JSON then that might help too.

function output_json(data) {
    var i, j, k;
    for (i=0; i<Object.keys(data).length; i++) {
        group_=Object.values(data)[i];
        for (j=0; j<Object.keys(group_).length; j++) {
            person=Object.values(group_)[j];
            person_id=Object.keys(person)[0];
            console.log(person_id);
            for (k=0; k<Object.keys(person).length; k++) {
                person_info=Object.values(person)[k][0];
                console.log(person_info);
            }
        }
    }
}

I want it to print out the id, and then the name, registration 1, registration 2, week and half_term for each id. At the moment it prints like this:

HA09_000

{name: "Wyatt Feldt", registration_1: "R", registration_2: "R", week: 0, half_term: 1}

But I want it to print like this for every single one:

HA09_000

Wyatt Feldt

R

R

0

1

Here is some Pseudo Code for what I would like to achieve:

FOR GROUP IN DATA:
    FOR PERSON IN GROUP:
        PRINT(PERSON.ID)
        FOR INFO IN PERSON:
            PRINT(INFO)

Thanks.

EDIT: This is the function I am using to retrieve the data:

$.getJSON("http://localhost:8000/data.json", function(data) {
    output_json(data);
});

Answer 1

Two useful ideas: (1) objects: if this is going to be a real system someday, and the data from the service represents groups of people, then the code ought to say that too. As an example, I've included a simple Person object who knows how to build itself from a flat representation and knows how to render itself on the console. (2) key ordering is not determined in JS object. To get values from specifically ordered keys, one must specify the ordering. The person print() method does this with an array.

See it here, running on a subset of the data...

$.getJSON("http://localhost:8000/data.json", function(data) {
    print_items(data);
});

class Person {
    constructor(data) {
        this.id = Object.keys(data)[0];
        this.state = data[this.id][0];
    }
    print() {
        console.log(this.id);
        let displayKeys = ['name', 'registration_1', 'registration_2', 'week', 'half_term'];
        displayKeys.forEach(key => console.log(this.state[key]));
    }
    asTableRow() {
        let displayKeys = ['name', 'registration_1', 'registration_2', 'week', 'half_term'];
        let tds = displayKeys.map(key => `<td>${this.state[key]}</td>`);
        return `<tr>${tds}</tr>`;
    }
}

function print_items(data) {
    Object.keys(data).forEach(groupKey => {
        let group = data[groupKey];
        Object.keys(group).forEach(personKey => {
            let person = new Person(group[personKey]);
            person.print();
        });
    });
}

Answer 2

You can clean up the internal loop by looking at each key and passing the value only. Also I suggest pulling the Object.keys(person).length out of your for loop because it will process what the keys are on every loop. If you put them into a variable and reference that it avoids reassessing the keys.

    var groups = Object.keys(testData);
    for(var i = 0; i<groups.length; i++){
        var group = testData[groups[i]];
        for(var j = 0; j<group.length; j++){
            var personEntry = group[j];
            var person_id = Object.keys(personEntry)[0];
            console.log(person_id);
            var personEntries = personEntry[person_id];
            for(var k = 0; k<personEntries.length; k++){
                var personValues = Object.values(personEntries[k]);
                for(var l = 0; l<personValues.length; l++){
                    console.log(personValues[l]);
                }
            }
        }
    }

Answer 3

Loop through the properties of the object using a for/in loop.

I have added the for/in loop to your code (using the person_info object) and tested it and it is printing what you desire. Hope this helps.

function output_json(data) {
    var i, j, k;
    for (i=0; i<Object.keys(data).length; i++) {
        group_=Object.values(data)[i];
        for (j=0; j<Object.keys(group_).length; j++) {
            person=Object.values(group_)[j];
            person_id=Object.keys(person)[0];   
            console.log(person_id);
            for (k=0; k<Object.keys(person).length; k++) {
                person_info=Object.values(person)[k][0];
                //loop through the properties of the person_info object
                //using a for/in loop
                for (var key in person_info) {
                   console.log(person_info[key]); 
                }              
            }
        }
    }
}