通过API数组进行迭代，data.forEach不是函数

Question

昨天我试图获得一些帮助，但是我没有真正涉及到很多问题，也没有给出很多代码，但是在这里我们再次尝试。请不要因为我对编码的理解不够而开除我：）。

我正在尝试遍历jSON中的API GET响应。但是正如您在代码中看到的那样，我陷入了forEach循环中。这是错误消息：未捕获（按承诺）TypeError：data.forEach不是函数 在index.js：26

这是完整的javascript代码：

"use strict";

window.addEventListener('load', () => {

  let form = document.getElementById('search-form');
  let content = document.getElementById('content');
  let searchField = document.getElementById('search');

  form.addEventListener('submit', event => {
    event.preventDefault();
    search(searchField.value);
  });
});

/**
 * Makes a request to https://restcountries.eu/rest/v2/name/{query} .
 * @param {string} query The user’s search query
 * @param {HTMLElement} content The <tbody> element that the result will be printed to
*/

function search(query, container) {
  window.fetch('https://newsapi.org/v2/top-headlines?country=' + encodeURIComponent(query) + "&apiKey=blabla")
    .then(response => response.json())
    .then(data => {
      console.log(data);
      data.forEach(item => {
        createArticlesHolders(item, container);
      })
    });
}

function createArticlesHolders(newsData, container) {

  let card = document.createElement('div');
  card.className= "card";
  card.style.width = "20rem";
  content.appendChild(card);

  let cardTitle = createElement("h5");
  cardTitle.className = "card-title";
  cardTitle.textContent = newsData.title;
  card.appendChild(cardTitle);

  let cardImg = document.createElement("img");
  cardImg.className = "card-img-top";
  cardImg.setAttribute('src', newsData.urlToImage);
  card.appendChild(cardImg);

}

$('#myModal').on('shown.bs.modal', function () {
  $('#myInput').trigger('focus')
})

我想做的是，当某人在搜索框中搜索国家/地区代码时，将会出现该国家/地区的一些热门新闻。然后，该代码应该使用引导类创建元素。

这是console.log（data）;

Answer 1

您无法使用json遍历forEach。为此，您可以使用Object.keys()或for...in循环-在顶级键上进行迭代，即：

...
keys = Object.keys(data);
keys.forEach(key => {
    createArticlesHolders(data[key], container);
})
...

或

...
for (let key in data) {
    createArticlesHolders(data[key], container);
}
...

编辑：
不知道data是json还是array-如果是第二个，显然您应该以前遍历它。

Answer 2

数据是没有forEach方法的常规对象。您应该遍历对象的属性。

let data = {
  "articles": [
    {
      "author": "Author 1"
    },
    {
      "author": "Author 2"
    },
    {
      "author": "Author 3"
    }
  ]
}

data.articles.forEach((obj) => {
  console.log(obj.author)
});

Answer 3

您应包括console.log(data)的印刷品。但是无论如何，只要阅读错误消息，data.forEach都不是函数；因此，data不是数组。