在javascript中循环对象答案

【问题标题】：Looping through objects in javascript在javascript中循环对象
【发布时间】：2019-06-19 15:32:25
【问题描述】：

我知道这是我应该知道的，但我无法弄清楚。

const food = {
  "design": [
    {
      "forTemperature": {
        "high": "100",
        "low": "70"
      },
      "productURL": "",
      "imageURL": ""
    },
    {
      "forTemperature": {
        "high": "80",
        "low": "65"
      },
      "productURL": "",
      "imageURL": ""
    },
    {
      "forTemperature": {
        "high": "75",
        "low": "65"
      },
      "productURL": "",
      "imageURL": ""
    },
    {
      "forTemperature": {
        "high": "67",
        "low": "60"
      },
      "productURL": "",
      "imageURL": ""
    }
  ]
}

我拥有的基本 json 文件，数组中的对象，但执行以下操作：

food.design.map((item, i) => i

对我不起作用。

我需要采取什么方法？

import food from "./apiDesign.json";


const New = props => {

  const [food, setFood] = useState([]);

  useEffect(() => {

    const fetchAPI = async e => {
      const designer = await food;
      setFood(designer);
    };

    fetchAPI();

  }, [])

  const stuff = () => {
    return loop // I was trying to loop it in here
  };

  return (
    {stuff}
  )
}

export default New;

【问题讨论】：

你的预期输出是什么？
food.design.map((item, i) => i); // 返回 [0,1,2,3]。你能解释一下你需要哪些值吗？你还想 map() 还是循环？
@assoron @AswinKumar 我收到了Cannot read property 'map' of undefined
@hellomello 您在什么环境中运行代码？因为我很确定在通常的在线 REPL 上运行良好。
@assoron 我正在使用 reactjs 在codesandbox.io 中运行它。这就是你要问的吗？对不起！另外，感谢您的帮助！

标签： javascript arrays json javascript-objects

【解决方案1】：

这对我来说很好，因为您可以看到它正确地循环通过数组。你有什么问题？

const food = {
  "design": [
    {
      "forTemperature": {
        "high": "100",
        "low": "70"
      },
      "productURL": "",
      "imageURL": ""
    },
    {
      "forTemperature": {
        "high": "80",
        "low": "65"
      },
      "productURL": "",
      "imageURL": ""
    },
    {
      "forTemperature": {
        "high": "75",
        "low": "65"
      },
      "productURL": "",
      "imageURL": ""
    },
    {
      "forTemperature": {
        "high": "67",
        "low": "60"
      },
      "productURL": "",
      "imageURL": ""
    }
  ]
}

food.design.map((item, i) => console.log(i, item))

【讨论】：

@hellomello - 你从哪里得到的？当你点击按钮Run code snippet?
哦，我明白你在说什么。嗯，这个问题发生在我的测试方面。如果我正在处理reactjs，这应该有效吗？还是应该一样？
@hellomello - 是的，它应该可以工作，你显然做错了什么。该错误告诉您，在您使用的对象中，design 子对象不存在。

【解决方案2】：

下面的方法将返回 food.design 中的每个对象：

food.design.map(item => { /* do something here */ });

【讨论】：

它将返回 food.design 中每个对象的转换副本数组。
@assoron 是的，但他没有提到他想要的输出是什么，所以根据我们目前掌握的信息，我认为目前这是可以接受的。

【解决方案3】：

如果您使用的是 ECMA Script 6，请使用这个

const food = {
  "design": [
    {
      "forTemperature": {
        "high": "100",
        "low": "70"
      },
      "productURL": "",
      "imageURL": ""
    },
    {
      "forTemperature": {
        "high": "80",
        "low": "65"
      },
      "productURL": "",
      "imageURL": ""
    },
    {
      "forTemperature": {
        "high": "75",
        "low": "65"
      },
      "productURL": "",
      "imageURL": ""
    },
    {
      "forTemperature": {
        "high": "67",
        "low": "60"
      },
      "productURL": "",
      "imageURL": ""
    }
  ]
}
const obj =  food.design;
for (const key of Object.keys(obj)) {
    console.log(key, obj[key]);
}

【讨论】：