Hello everyone I have a array of objects now those objects hold have multiple keys and those keys are dynamic so I have no idea how can I loop through data and show them in the table I am not sure how can I access those when I loop through. I was able to get the object keys into a separate array but don't how to utilize them. Here is the array of data and the array of keys can anyone guide or help me

This is the data array

var data = {
"data": [
        {
            "nationality": "Indonesia",
            "gender": "Male",
            "country": "Indonesia",
            "preferred_role": "Customer Service",
            "work_experience": "More than 1 year and less than 2 years",
            "preferred_work_environment": "Open to both",
            "count": 381
        },
              ]
    }

This is the keys array

["nationality", "gender","country","preferred_role","work_experience","count","preferred_work_environment"]

CodePudding user response：

This is a simple example of how iterates object's properties:

var data = {
    "data": [{
        "nationality": "Indonesia",
        "gender": "Male",
        "country": "Indonesia",
        "preferred_role": "Customer Service",
        "work_experience": "More than 1 year and less than 2 years",
        "preferred_work_environment": "Open to both",
        "count": 381
    }, ]
};

for (let i in data.data[0]) {
    console.log(i);
}

For more details, you can read:

• for...in
• Iteration protocols

CodePudding user response：

By using object.entries you can get key and values of a object.

for (const [key, value] of Object.entries(data.data[0])) {
      console.log(`${key}: ${value}`);
    }

By this method you will get array of keys so,you can use them

Object.keys(data.data[0])

By this method you will get values of a object

Object.values(data.data[0])