Javascript：通过对象迭代循环

Question

Given the following json object structure, I need to fetch the id and value for each of the goals object as well as planet, people, and theme's object value also.

var data = {
  "goals": [{
      "id": "goal-09",
      "colour": "#FD6925",
      "priority": "People",
      "theme": "Sustainable Infrastructure",
      "title": "Industry, Innovation & Infrastructure",
      "value": 4
    },
    {
      "id": "goal-12",
      "colour": "#BF8B2E",
      "priority": "Planet",
      "theme": "Responsible Consumption",
      "title": "Responsible Consumption & Production",
      "value": 3
    },
    {
      "id": "goal-13",
      "colour": "#3F7E44",
      "priority": "Planet",
      "theme": "Environment",
      "title": "Climate Action",
      "value": 1
    }
  ],
  "planet": 50,
  "people": 50,
  "themes": {
    "Sustainable Infrastructure": 4,
    "Responsible Consumption": 3,
    "Environment": 1
  }
}

I have tried a couple of loops but this is a bit difficult, also you can have up to 17 goals and up to 5 different themes.

Object.keys(data).forEach(function(key) {
  alert(key+" "+data[key]); // logs keys in myObject
});

This is where I am testing https://jsfiddle.net/dhzpqo4n/ and I will be fetching the json string from sessionStorage.

the end goal is to construct a sql update statement to store these in a table with the following structure

update I've come up with the following script which is a step in the right direction to construct my sql update statement with the values if each of the goals.

let i = 0
while (data.goals[i].id) {
  document.write(data.goals[i].id + "=" + data.goals[i].value + " ");
  i++
}

Which gives goal-09=4 goal-12=3 goal-13=1 https://jsfiddle.net/3r49zqsu/4/

Answer 1

Create an array and push the result as follows:

1) if val is an array then loop through it to get the object's id and value . Then push it into result array.

2) If it is an object then first convert it into key=value form and then push it into result array.

3) else push the result as default key=value form

then finally join the array with space . That's it.

 var data = { goals: [ { id: "goal-09", colour: "#FD6925", priority: "People", theme: "Sustainable Infrastructure", title: "Industry, Innovation & Infrastructure", value: 4, }, { id: "goal-12", colour: "#BF8B2E", priority: "Planet", theme: "Responsible Consumption", title: "Responsible Consumption & Production", value: 3, }, { id: "goal-13", colour: "#3F7E44", priority: "Planet", theme: "Environment", title: "Climate Action", value: 1, }, ], planet: 50, people: 50, themes: { "Sustainable Infrastructure": 4, "Responsible Consumption": 3, Environment: 1, }, }; let result = []; for (let key in data) { const val = data[key]; if (Array.isArray(val)) { const temp = val.map(({ id, value }) => `${id}=${value}`); result = result.concat(temp); } else if (typeof val === "object") { const temp = Object.entries(val).map(([k, v]) => `${k}=${v}`); result = result.concat(temp); } else { result.push(`${key}=${val}`); } } console.log(result.join(" "));

You can simplify a bit

 var data = { goals: [ { id: "goal-09", colour: "#FD6925", priority: "People", theme: "Sustainable Infrastructure", title: "Industry, Innovation & Infrastructure", value: 4, }, { id: "goal-12", colour: "#BF8B2E", priority: "Planet", theme: "Responsible Consumption", title: "Responsible Consumption & Production", value: 3, }, { id: "goal-13", colour: "#3F7E44", priority: "Planet", theme: "Environment", title: "Climate Action", value: 1, }, ], planet: 50, people: 50, themes: { "Sustainable Infrastructure": 4, "Responsible Consumption": 3, Environment: 1, }, }; let result = []; function pushInFinalResult(arr) { result = [...result, ...arr]; } for (let key in data) { const val = data[key]; if (Array.isArray(val)) { pushInFinalResult(val.map(({ id, value }) => `${id}=${value}`)); } else if (typeof val === "object") { pushInFinalResult(Object.entries(val).map(([k, v]) => `${k}=${v}`)); } else { pushInFinalResult([`${key}=${val}`]); } } console.log(result.join(" "));

Removing spaces and -

 var data = { goals: [ { id: "goal-09", colour: "#FD6925", priority: "People", theme: "Sustainable Infrastructure", title: "Industry, Innovation & Infrastructure", value: 4, }, { id: "goal-12", colour: "#BF8B2E", priority: "Planet", theme: "Responsible Consumption", title: "Responsible Consumption & Production", value: 3, }, { id: "goal-13", colour: "#3F7E44", priority: "Planet", theme: "Environment", title: "Climate Action", value: 1, }, ], planet: 50, people: 50, themes: { "Sustainable Infrastructure": 4, "Responsible Consumption": 3, Environment: 1, }, }; let result = []; function pushInFinalResult(arr) { result = [...result, ...arr]; } for (let key in data) { const val = data[key]; if (Array.isArray(val)) { pushInFinalResult( val.map(({ id, value }) => `${id.replace("-", "")}=${value}`) // change ); } else if (typeof val === "object") { pushInFinalResult( Object.entries(val).map(([k, v]) => `${k.replace(" ", "")}=${v}`) // change ); } else { pushInFinalResult([`${key}=${val}`]); } } console.log(result.join(" "));

Answer 2

Do you mean something like this?

{goals: data.goals.map(k=>{return {id:k.id,value:k.value}}),planet:data.planet,people:data.people,themes:data.themes}

What happens here is it loops through all the goals and returns an object of only the id and the value.