Как правильно записать индекс (детали в вопросе)?

Question

[Сергей]

Есть следующий код:

Как записать индекс каждому из баннеров таким образом, как будто он единственный среди карточек?

Что должно получиться.

{
  ...
  "banners": [{
    "index": 2 // Banner 1
  }, {
    "index": 2 // Banner 2
  }, {
    "index": 2 // Banner 3
  }, {
    "index": 5 // Banner 4
  }],
  ...
}

Comments

[ildar-meyker]

Попробуйте переформулировать задачу. Не особенно понятно, чего вы добиваетесь.

[Сергей Соколов]

Banner 4 не должен ли иметь индекс не 5, а 6 ?

[Сергей]

Сергей Соколов, каждый баннер должен иметь индекс, как если бы он был единственным баннером среди карточек. Возможно, мой код надо полностью переписать, чтобы в итоге был соответствующий результат, но пока это всё, к чему я пришёл.

Answer 1

[ildar-meyker]

Я убрал лишний код, не относящийся к задаче напрямую, и вот что получилось.

const $elems = document.querySelector('.js-cards').children;

let banners = [];

[...$elems].forEach(($elem, index) => {
  if ( !('card' in $elem.dataset) ) {
    banners.push({
      elem: $elem,
      index: index - banners.length
    })
  }
});

console.log(banners);

Comments

[Сергей]

Спасибо, это решает мою задачу!

Answer 2

[Сергей Соколов]

В reduce() в передаваемом объекте добавьте поле для передачи индекса баннера.

Если встречается card – поле сбрасывать.
Если встретился баннер:
- нет индекса – брать i и сохранять его в объекте;
- есть индеса – использовать его.

spoiler

const container = document.querySelector(".js-cards");

const cards = [...container.children].reduce(function (obj, item, i) {
  if ("card" in item.dataset) {
    obj[item.dataset.card] = (obj[item.dataset.card] || []).concat(item);
    obj["all"] = (obj["all"] || []).concat(item);
    if (obj.hasOwnProperty('bannerIndex')) delete obj.bannerIndex;
  } else {
    if (! obj.hasOwnProperty('bannerIndex')) obj.bannerIndex = i;
    obj["banners"] = (obj["banners"] || []).concat({ item: item, index: obj.bannerIndex });
  }
  return obj;
}, {});

console.log(cards);

Comments

[Сергей]

Спасибо за помощь, возьму на заметку Ваше решение, хоть оно не совсем удовлетворяет поставленной цели.