Как распределить рендер массива в разные блоки?

Question

[Айнур Ярулин]

Здравствуйте, допустим есть какой-то массив со списком пользователей:

const users = [
  {id: 1, name: "Артём", age: 20},
  {id: 2, name: "Бродяга", age: 9},
  {...допустим тут еще 4 объекта
]

и есть два HTML блока:

<div class="block-1"></div>
<div class="block-2"></div>

Как правильно сделать, чтобы первые 3 объекта рендерились в первый блок, а следующие 3 - во второй.
Сейчас я делаю это вручную с помощью insertAdjacentHTML

Comments

[Олег]

Вы же обещали, что не будете решать вступительные в школу яндекса?)
циклом foreach

[Алексей Уколов]

Чем вас не устраивает ваше текущее решение? Кстати, покажите его.

[Айнур Ярулин]

Олег, ну это в целом другое, я в принципе хотел узнать, вдруг есть
какое нибудь магическое свойство, которое решает такие задачи

[Айнур Ярулин]

Алексей Уколов, оно выглядит примерно так:

document.querySelector(".block-1").insertAdjacentHTML('afterbegin', `
  <div>${users[0].name}<div>
  <div>${users[1].name}<div>
  <div>${users[2].name}<div>
`)
document.querySelector(".block-2"). // ну и тут для других трёх

Получается что всё делаю вручную и это как-то плохо помоему

Answer 1

[v3shin]

Например,

while (users.length) {
    let part = users.splice(0, 3);
    // что-то делаем с part
}

Comments

[Айнур Ярулин]

Спасибо ❤

Answer 2

[Tim]

как вариант можно так

Comments

[Айнур Ярулин]

Работает, спасибо)