скопируйте элемент массива и поместите его в положение, зависящее от значения свойства?

#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) ], [])