首页 > 解决方案 > 嵌套循环数组 .length 属性

问题描述

我正在从新闻 API 源呈现数据。我使用嵌套循环来遍历每个主题,以获取返回的数组的长度(限制为 5,但可以更少)。

嵌套循环应该限制为数组的长度,但是我没有定义。我正在尝试使用topNews[i].data[j].length,但我一直不确定。在嵌套循环中获取嵌套数组的长度是否有不同的方法?下面的代码有效,但如果源少于 5,那么我会得到未定义并且它会中断。如果我能把它限制在它会停止而不是断裂的长度。

function renderData() {
  let html = "";
  for (let i = 0; i < twitterTrends.length; i++) {
    html += "<section class='news'>";
    html += `<h2>${twitterTrends[i]}</h2>`;
    html += "<ul class='articles'>";
    for (let j = 0; j < 5; j++) {
      html += `<li>
        ${
          topNews[i].data[j].image_url
            ? `<div class="thumbnail" style="background-image:url('${topNews[i].data[j].image_url}')"></div>`
            : ""
        }
        <h3><a href="${topNews[i].data[j].url}" target="_blank">${
        topNews[i].data[j].title
      }</a></h3>
        <p>${topNews[i].data[j].snippet}</p>
      </li>`;
    }
    html += "</ul></section>";
  }
  html +=
    "<button type='button' class='js-restart button'>Refresh Results</button>";
  $("#results").html(html);
}

标签: javascriptarraysloopsnested

解决方案


更改此行:

for (let j = 0; j < 5; j++) 

for (let j = 0; j < topNews[i].data.length; j++) 

推荐阅读