Как исправить для цикла не получить результаты в массиве строк в JavaScript - PullRequest
Новая
       12

Как исправить для цикла не получить результаты в массиве строк в JavaScript

0 голосов
/ 20 декабря 2018

Я создаю музыкальный проигрыватель, и у меня возникла проблема с циклом for и массивом.У меня есть следующая функция в моем файле main.js 

function CreateDatabaseArtists() {
  for (n = 0; n < DatabaseArtists.length+1; n++) {
    if (DatabaseArtists[n.toString()].name === "") {} else {      
      let NewArtistBtn = document.createElement("div");
      NewArtistBtn.id = DatabaseArtists[n].artistgroup;
      // NewArtistBtn.onclick = function() {OpenArtist(NewArtistBtn.id);};
      NewArtistBtn.classList.toggle("column");
      NewArtistBtn.setAttribute("style", "word-wrap: break-word; float: none; width: 150px; text-align:center;align-items:center; display: inline-block; white-space: nowrap; overflow: hidden; text-overflow:ellipsis;");           
      let ArtistIMG = document.createElement("img");
      if (DatabaseArtists[n].ArtistArt == "") {
        ArtistIMG.src = "https://iplock.weebly.com/uploads/9/5/7/3/95731436/p298.png";
        ArtistIMG.style.borderRadius = "50%";
      } else {
        ArtistIMG.src = DatabaseArtists[n].ArtistArt;
        ArtistIMG.style.borderRadius = "50%";
      }
      ArtistIMG.style.width = "150px"; ArtistIMG.style.height = "150px";
      NewArtistBtn.appendChild(ArtistIMG);
      let text = document.createElement("p");
      text.innerHTML = "ahhh-humbug";
      // DatabaseArtists[b].name;
      ArtistIMG.setAttribute("aria-label", text.innerHTML);
      NewArtistBtn.appendChild(text);
      document.getElementById("artists").appendChild(NewArtistBtn);
    }
  }
}

И часть с 

for (n = 0; n < DatabaseArtists.length+1; n++) {
        if (DatabaseArtists[n.toString()].name === "") {}

Не работает, я получаю сообщение об ошибке, в котором говорится, что она не может найти переменную для «имя », хотя в массиве это "name": "AJR", "explicit": false, "artistgroup": "ajr", "ArtistArt": "" Что я должен делать?

Ответы [ 2 ]

0 голосов
/ 20 декабря 2018

Честный совет, почему бы вам не разбить приложение, просто так легче поддерживать.Также, если вы используете метод forEach, вам не нужно беспокоиться об индексе в той же степени, как если бы вы использовали традиционный цикл for. 

const defaultStyle = "word-wrap: break-word; float: " +
  "none; width: 150px; text-align:center;align-items:center; " +
  "display: inline-block; white-space: nowrap; " +
  "overflow: hidden; text-overflow:ellipsis;";
const defaultImg = 'https://iplock.weebly.com/uploads/9/5/7/3/95731436/p298.png';
const appRoot = document.getElementById("artists");


const createImage = artist => {
  const img = document.createElement("img");
  const source = artist.ArtistArt === '' ? defaultImg : artist.ArtistArt;

  img.src = source;
  img.style.borderRadius = "50%";
  img.style.width = "150px";
  img.style.height = "150px";

  return img;
};


const createButton = artist => {
  const btn = document.createElement("div");
  const img = createImage(artist);
  const ptag = document.createElement("p");

  ptag.innerHTML = "ahhh-humbug";
  btn.id = artist.artistgroup;
  btn.classList.toggle("column");

  btn.setAttribute("style", defaultStyle);
  btn.appendChild(img);
  btn.appendChild(ptag);

  return btn;
};


const createDatabaseArtists = () => {
  databaseArtists.forEach(artist => {
    if (artist.name !== '') {
      appRoot.appendChild(createButton(artist));
    }
  });
};
0 голосов
/ 20 декабря 2018 
for (n = 0; n < DatabaseArtists.length+1; n++)

Вы выполняете итерацию за концом массива, поэтому последний цикл попытается получить доступ к свойству name в undefined.Индекс должен быть от 0 до length - 1.

...