我有一個陣列：
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];
uj5u.com熱心網友回復：
您可以使用 flatMap
let rawArray = [{ name: "Name", repeat: null }, { name: "Name1", repeat: 2 }];
console.log(rawArray.flatMap(item => {
const { repeat } = item
if (repeat === null) {
return [item] // or [] if you want to omit item w/o repeat
}
return Array.from({ length: repeat}).map(() => ({ ...item }))
}))uj5u.com熱心網友回復：
普通的 HTML 和 js
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<ul id="myList">
</ul>
<script type="text/javascript">
const rawArray = [
{ name: 'Name', repeat: null },
{ name: 'Name1', repeat: 2 },
{ name: 'Name2', repeat: 5 },
{ name: 'Name3', repeat: null },
]
function my_code(){
rawArray.map((item)=> {
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) => {
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();
</script>
</body>
</html>反應js
const rawArray = [
{ name: 'Name', repeat: null },
{ name: 'Name1', repeat: 2 },
{ name: 'Name2', repeat: 5 },
{ name: 'Name3', repeat: null },
]
const MyList= () => {
return (
<div>
{rawArray.map((item, i) => (
<div key={i.toString}>
{item.name}
{item.repeat && (
<>
{Array.from(Array(item.repeat).keys()).map((repeatItem, r) => (
<div key={r.toString}>
{item.name}
<i>- repeat {repeatItem 1}</i>
</div>
))}
</>
)}
</div>
))}
</div>
)
}
export default memo(MyList)
uj5u.com熱心網友回復：
您可以使用減少：
const rawArray = [
{ name: "Name", repeat: null },
{ name: "Name1", repeat: 2 },
{ name: "Name2", repeat: 1 },
{ name: "Name3", repeat: 3 },
]
const result = rawArray.reduce((acc, item) => {
if (!item.repeat) {
return acc
}
return [
...acc,
...[...new Array(item.repeat)].map(i => item)
]
}, [])
console.log(result)
或者代碼稍微少一點：
const result = rawArray.reduce((acc, item) => (!item.repeat) ? acc : [
...acc,
...[...new Array(item.repeat)].map(i => item)
], [])
轉載請註明出處，本文鏈接：https://www.uj5u.com/gongcheng/364154.html
標籤：javascript 查询 数组 反应 Vue.js