#javascript #jquery #arrays #reactjs #vue.js
Вопрос:
У меня есть массив:
let rawArray = [{ name: "Name", repeat: null }, { name: "Name1", repeat: 2 }, ...];
Мне нужно зациклиться rawArray
и прочитать свойство повтора, если повтор не равен нулю, скопируйте этот элемент и повторите этот элемент, купите значение времени повтора?
Как это возможно? 🙂
Я хочу, чтобы результат был таким :
let result = [..., { name: "Name1", repeat: 2 }, ..., { name: "Name1", repeat: 2 } ... { name: "Name1", repeat: 2 }, ... etc];
Ответ №1:
Вы можете использовать flatMap
let rawArray = [{ name: "Name", repeat: null }, { name: "Name1", repeat: 2 }]; console.log(rawArray.flatMap(item =gt; { const { repeat } = item if (repeat === null) { return [item] // or [] if you want to omit item w/o repeat } return Array.from({ length: repeat}).map(() =gt; ({ ...item })) }))
Комментарии:
1. Дубликат да, но я хочу поставить
Name1
на каждую 2-ю позицию в массиве.2. @Милошн. Тогда вам нужно будет лучше объяснить ожидаемое поведение. Приведите несколько примеров с различными входными данными. Особенно в некоторых крайних случаях, например, если у вас есть 2 элемента с одинаковым повторением или если у вас есть повторение 2 и повторение 3, что будет на 6-й позиции.
Ответ №2:
Обычный HTML и js
lt;!DOCTYPE htmlgt; lt;htmlgt; lt;headgt; lt;/headgt; lt;bodygt; lt;ul id="myList"gt; lt;/ulgt; lt;script type="text/javascript"gt; const rawArray = [ { name: 'Name', repeat: null }, { name: 'Name1', repeat: 2 }, { name: 'Name2', repeat: 5 }, { name: 'Name3', repeat: null }, ] function my_code(){ rawArray.map((item)=gt; { var node = document.createElement("LI"); var textnode = document.createTextNode(item.name); node.appendChild(textnode); document.getElementById("myList").appendChild(node); if(item.repeat) { Array.from(Array(item.repeat).keys()).map((repeatItem) =gt; { var nodeRepeat = document.createElement("LI"); var textnodeRepeat = document.createTextNode(item.name '(repet' (repeatItem 1) ')'); nodeRepeat.appendChild(textnodeRepeat); document.getElementById("myList").appendChild(nodeRepeat); return null }) } return null }) } window.onload=my_code(); lt;/scriptgt; lt;/bodygt; lt;/htmlgt;
реагировать js
const rawArray = [ { name: 'Name', repeat: null }, { name: 'Name1', repeat: 2 }, { name: 'Name2', repeat: 5 }, { name: 'Name3', repeat: null }, ] const MyList= () =gt; { return ( lt;divgt; {rawArray.map((item, i) =gt; ( lt;div key={i.toString}gt; {item.name} {item.repeat amp;amp; ( lt;gt; {Array.from(Array(item.repeat).keys()).map((repeatItem, r) =gt; ( lt;div key={r.toString}gt; {item.name} lt;igt;- repeat {repeatItem 1}lt;/igt; lt;/divgt; ))} lt;/gt; )} lt;/divgt; ))} lt;/divgt; ) } export default memo(MyList)
Ответ №3:
Вы можете использовать сокращение:
const rawArray = [ { name: "Name", repeat: null }, { name: "Name1", repeat: 2 }, { name: "Name2", repeat: 1 }, { name: "Name3", repeat: 3 }, ] const result = rawArray.reduce((acc, item) =gt; { if (!item.repeat) { return acc } return [ ...acc, ...[...new Array(item.repeat)].map(i =gt; item) ] }, []) console.log(result)
или с чуть меньшим количеством кода:
const result = rawArray.reduce((acc, item) =gt; (!item.repeat) ? acc : [ ...acc, ...[...new Array(item.repeat)].map(i =gt; item) ], [])