Javascript:遍历对象

时间:2021-06-30 23:28:27

标签: javascript arrays object

给定以下 json 对象结构,我需要获取每个目标对象的 id 和值以及行星、人物和主题的对象值。

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
  }
}

我尝试了几个循环,但这有点困难,而且您最多可以有 17 个目标和最多 5 个不同的主题。

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

这是我测试 https://jsfiddle.net/dhzpqo4n/ 的地方,我将从 sessionStorage 获取 json 字符串。

sessionStorage

最终目标是构造一个 sql update 语句,将它们存储在具有以下结构的表中

enter image description here

更新 我想出了以下脚本,这是朝着正确方向迈出的一步,可以使用每个目标的值构建我的 sql 更新语句。

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

这给了 goal-09=4 goal-12=3 goal-13=1 https://jsfiddle.net/3r49zqsu/4/

2 个答案:

答案 0 :(得分:1)

创建一个数组并推送结果如下:

1) 如果 val 是一个数组,则循环遍历它以获取对象的 idvalue。然后将其推入 result 数组。

2) 如果是对象,则先将其转换为key=value形式,然后将其推入结果数组。

3) 否则将结果推送为默认 key=value 表单

然后最后用space加入数组。就是这样。

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(" "));

你可以简化一下

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(" "));

删除空格和 -

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(" "));

答案 1 :(得分:0)

你的意思是这样吗?

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

这里发生的是它遍历所有目标并返回一个只有 id 和值的对象。