[8/21] Испытание мороженым

При проверке все картинки сходятся с ожидаемыми, но почему не принимает?

 var assortmentData = [

{
inStock: false,
isHit: true
},
{
inStock: false,
isHit: true
},
{
inStock: true,
isHit: false
},
{
inStock: false,
isHit: false
},
{
inStock: false,
isHit: false
}
];
var updateCards = function(products) {
var elements = document.querySelectorAll(’.good’);
for(var i = 0; i < elements.length; i++) {
var element = elements[i];
element.classList.add(‘good–available’);
var product = products[i];
if(!product.inStock) {
element.classList.add(‘good–unavailable’);
}
if(product.isHit) {
element.classList.add(‘good–hit’);
}
}
}
updateCards(assortmentData);

Возможно, ваши товары имеют сразу оба класса - available и unavailable. Проверьте этот момент через инструменты разработчика в браузере.

Мой вариант :lion:

Испытание мороженым
var updateCards = products => {
  var elements = document.querySelectorAll('.good');
  for (var i = 0; i < elements.length; i++) {
    if (products[i].isHit) {
      elements[i].classList.add('good--hit');
    }
    if (products[i].inStock) {
      elements[i].classList.add('good--available');
    }else {
      elements[i].classList.add('good--unavailable');
    }
    }
  }
    
updateCards(assortmentData);
var updateCards = function (arrayData) {
  var goods = document.querySelectorAll('.good');
  
  for (var i = 0; i < goods.length; i++) {
    if (arrayData[i].inStock) {
      goods[i].classList.add('good--available'); 
      
      if (arrayData[i].isHit) {
        goods[i].classList.add('good--hit');
      }
    } else {
      goods[i].classList.add('good--unavailable'); 
      
      if (arrayData[i].isHit) {
        goods[i].classList.add('good--hit'); 
      }
    }
  }
}

updateCards(assortmentData);

У меня вроде всё как в прошлом задании, всё проходит.

var updateCards = function (products) {
var elements = document.querySelectorAll(’.good’);
for (var i = 0; i < elements.length; i++) {
var element = elements[i];

var product = products[i];

var availabilityClass = 'good--available';
if (!product.inStock) {
  availabilityClass = 'good--unavailable';
}

element.classList.add(availabilityClass);

if (product.isHit) {
  element.classList.add('good--hit');      
}

}
};
updateCards(assortmentData);

деструктуризация + forEach
const updateCards = function (products) {
  const elements = document.querySelectorAll('.good');
  
  [...elements].forEach((item, index) => {
    let availabilityClass = 'good--available';
    
    if (!products[index].inStock) {
      availabilityClass = 'good--unavailable';
    }
    item.classList.add(availabilityClass);

    if (products[index].isHit) {
      item.classList.add('good--hit');      
    }
  });
}

updateCards(assortmentData);
2 лайка

Решил так

function updateCards (cards) {
  var elem = document.querySelectorAll(".good")
  for (i = 0; i < cards.length; i++) {
    var card = cards[i];
    elem[i].classList.add("good--available");
    if (card.inStock == false) {
      elem[i].classList.remove("good--available");
      elem[i].classList.add("good--unavailable");
    }
    if (card.isHit == true) {
      elem[i].classList.add("good--hit");
    }
  }
}

updateCards (assortmentData);

My option.

var updateCards = function (items) {
  var goods = document.querySelectorAll('.good');
  for (var i = 0; i < goods.length; i++) {
    
    if (items[i].isHit) {
      goods[i].classList.add('good--hit');
      };
    if (items[i].inStock) {
      goods[i].classList.add('good--available');
      } else {
        goods[i].classList.add('good--unavailable');
        };
      };
   };

updateCards(assortmentData);

var updateCards = function (cards) {

var elements = document.querySelectorAll(’.good’);

for (var i = 0; i < cards.length; i++) {

var element = elements[i];
var card = cards[i];

if (card.inStock === true) {
  element.classList.add('good--available');
} else {
  element.classList.add('good--unavailable');
}

if (card.isHit) {
  element.classList.add('good--hit');
}

}

}

updateCards(assortmentData);

мое решение

image

В чем может быть ошибка?

Мой код.
Сделала без переменных, никак не могу понять зачем они нужны, если индексы объектов в коллекции полностью совпадают с ними в массиве.

Сводка

var updateCards=function(assortment){
var iceCream=document.querySelectorAll(".good");
for(var i=0; i<assortment.length; i++){
if(assortment[i].inStock){
iceCream[i].classList.add(“good–available”);
}else{
iceCream[i].classList.add(“good–unavailable”);
}
if(assortment[i].isHit){
iceCream[i].classList.add(“good–hit”);
}
}
}
updateCards(assortmentData);

еще вчера в этой задаче были технические неполадки, сегодня все пофиксили, вот мой код:
var assortmentData = [
{
inStock: true,
isHit: false
},
{
inStock: false,
isHit: false
},
{
inStock: true,
isHit: true
},
{
inStock: true,
isHit: false
},
{
inStock: false,
isHit: false
}
];

var updateCards = function (goods) {

var elements = document.querySelectorAll(’.good’);

for (var i = 0; i < elements.length; i++) {

var element = elements[i];
var good = goods[i];


var availabilityClass = 'good--available';  
if (!good.inStock) {
  availabilityClass = 'good--unavailable';      
}
element.classList.add(availabilityClass);
if (good.isHit) {
  element.classList.add('good--hit');      
}

}

Кто-нибудь, объясните, пожалуйста, почему функция работает, даже, если в ней не указано что возвращать (нет return) ? И если указывать, что надо возвращать? Я возвращала и products и goods - проверка успешна в любом случае.

Код

var updateCards = function (products) {
var goods = document.querySelectorAll(’.good’);
for (i = 0; i < goods.length; i++) {
var good = goods[i];
var product = products[i];
var availabilityClass = ‘good–available’;

  if (!product.inStock) {
    availabilityClass = 'good--unavailable';
  }
good.classList.add(availabilityClass);

  if (product.isHit) {
    good.classList.add('good--hit');
  }

}
};
updateCards(assortmentData);

Работает

var assortmentData = [
      {
        inStock: true,
        isHit: false
      },
      {
        inStock: false,
        isHit: false
      },
      {
        inStock: true,
        isHit: true
      },
      {
        inStock: true,
        isHit: false
      },
      {
        inStock: false,
        isHit: false
      }
    ];

    var updateCards = function (array) {
      var iceCream = document.querySelectorAll('.good');
      for (var i = 0; i <= iceCream.length - 1; i++) {
        var element = iceCream[i];
        var arr = array[i];
        var availableClass = 'good--unavailable';
        if (!arr.inStock) {
          element.classList.add(availableClass);
        } else {
          availableClass = 'good--available';
          element.classList.add(availableClass);
        }
        if (arr.isHit) {
          element.classList.add('good--hit');
        }
      }
    }

    updateCards(assortmentData);
let updateCards = function(assortmentData) {
// Получаем список товаров 
  let products = document.querySelectorAll('.good');
  
  for(let i = 0; i < assortmentData.length; i++) {
    // Получаем текущий продукт  
    let product = products[i];

    // Получаем текущий объект
    let element = assortmentData[i];
  
    // Определяем наличие и добавляем класс    
    if (element.inStock){
      product.classList.add('good--available');
    } else {
      product.classList.add('good--unavailable');
    };
  
    // Определяем статус хит и добавляем класс  
    if (element.isHit) {
      product.classList.add('good--hit');
    };
  
  }
};

updateCards(assortmentData);

Как я понимаю, здесь(конкретно в этом случае) ничего, никуда отправлять или передавать из этой функции не нужно. Она просто отрабатывает свою задачу и далее от неё ничего не нужно.

var updateCards = function (cardsData) {
  var cardsList = document.querySelectorAll('.good')
  for(var i = 0; i < cardsList.length; i++) {
    var card = cardsList[i]
    var cardData = cardsData[i]
    var cardClass = 'good--available'
    
    if (!cardData.inStock) {
      cardClass = 'good--unavailable'
      }
      card.classList.add(cardClass)
      
    if (cardData.isHit) {
      card.classList.add('good--hit')
      }
      
    }
    
}
  
updateCards(assortmentData)

Здесь можно просто завершить выполнение функции, вызвав return.

var updateCards = function (cardsData) {
  var cardsList = document.querySelectorAll('.good')
  for(var i = 0; i < cardsList.length; i++) {
    var card = cardsList[i]
    var cardData = cardsData[i]
    var cardClass = 'good--available'
    
    if (!cardData.inStock) {
      cardClass = 'good--unavailable'
      }
      card.classList.add(cardClass)
      
    if (cardData.isHit) {
      card.classList.add('good--hit')
      }
  }
  
     return
     
}
  
updateCards(assortmentData)
var updateCards = (elements) => {
  var goods = document.querySelectorAll('.good'); 
  for (var i = 0; i < goods.length; i++) {
    if (elements[i].inStock) {
      goods[i].classList.add('good--available');
    } else {
      goods[i].classList.add('good--unavailable');
    }
    if (elements[i].isHit) {
      goods[i].classList.add('good--hit');
    }
  }
};

updateCards(assortmentData);

Вот методом forEach:

var assortmentData = [
{
inStock: true,
isHit: false
},
{
inStock: false,
isHit: false
},
{
inStock: true,
isHit: true
},
{
inStock: true,
isHit: false
},
{
inStock: false,
isHit: false
}
];

let updateCards = (cards) => {
let elements = document.querySelectorAll(‘.good’)
elements.forEach((element, index)=>{
let card = cards[index]
if(card.inStock) { element.classList.add(‘good–available’)}
else { element.classList.add(‘good–unavailable’)}
if(card.isHit) { element.classList.add(‘good–hit’)
}})
}
updateCards(assortmentData)