React Js数组操作

Question

希望你一切都好我在开始时遇到了一个数据数组操作的问题，随着工作的进展，现在需要更多的数据操作，我在这方面很缺乏(作为我职业生涯的早期)问题解释-作为数据，我正在接收一个对象数组，每个对象包含另一个信息数组(键值对)，该数组还包含另一个信息数组(键值对)，要求是我必须循环主数据对象项相对于深度嵌套数组的长度，并将它们显示在前面，除了我已经做了大部分。我在下面附上了我的问题的示例代码，我要求你们为这个问题提供解决方案

import React, { useState } from "react";
const data = [
{
id: 1,
name: "Something Goes here",
address: "Earth",
arr1: [
{
newId: 1,
title: "Title 1",
midName: "Nothing",
arr2: [
{
subId: 1,
goes: "Hello",
ollo: "Not what you think",
},
{
subId: 2,
goes: "Hello 2",
ollo: "Not what you",
},
],
},
],
},
{
id: 2,
name: "Something Goes",
address: "Mars",
arr1: [
{
newId: 3,
title: "Title sddsdsad",
midName: "Nothing",
arr2: [
{
subId: 2,
goes: "Hello adasdasdasd",
ollo: "Not what you think asdasdasdawd",
},
{
subId: 2,
goes: "Hello 2",
ollo: "Not what you asdasasd",
},
],
},
],
},
];
const App = () => {
const [dummy, setDummy] = useState([]);
let dummyArr = [],
tempObj,
temp;
const tempFunc = () => {
for (let i = 0; i < data.length; i++) {
for (let j = 0; j < data[i].arr1; j++) {
for (let k = 0; k < data[i].arr1[j].arr2; k++) {
temp = data[i].arr1[j].arr2[k];
delete data[i].arr1[j].arr2[k];
tempObj = { ...temp ,...data[i], };
dummyArr.push(tempObj);
tempObj = {};
console("tempObj -->", tempObj);
}
}
}
};
console.log("dummyArr", dummyArr);
return (
<React.Fragment>
<button>Hello oooo</button>
</React.Fragment>
);
};
export default App;

的预期结果是将两个数组都压入main itemObject中'

const sampleArray = [
{
id: 2,
name: "Something Goes",
address: "Mars",
newId: 3,
title: "Title sddsdsad",
midName: "Nothing",
subId: 2,
goes: "Hello adasdasdasd",
ollo: "Not what you think asdasdasdawd",
},
];

Answer 1

这段代码可以帮助您实现任何键数组的嵌套级别，并使其单个级别的数组列表提取非数组值的键。上面的答案只局限于嵌套，但这段代码并不局限于你有什么级别，什么键有一个数组值，它将迭代和n级别的树

感谢

const data = [
{
id: 1,
name: "Something Goes here",
address: "Earth",
arr1: [
{
newId: 1,
title: "Title 1",
midName: "Nothing",
arr2: [
{
subId: 1,
goes: "Hello",
ollo: "Not what you think",
},
{
subId: 2,
goes: "Hello 2",
ollo: "Not what you",
},
],
},
],
},
{
id: 2,
name: "Something Goes",
address: "Mars",
arr1: [
{
newId: 3,
title: "Title sddsdsad",
midName: "Nothing",
arr2: [
{
subId: 2,
goes: "Hello adasdasdasd",
ollo: "Not what you think asdasdasdawd",
},
{
subId: 2,
goes: "Hello 2",
ollo: "Not what you asdasasd",
},
],
},
{
newId: 4,
title: "Title sddsdsad1",
midName: "Nothing",
arr2: [
{
subId: 2,
goes: "Hello adasdasdasd",
ollo: "Not what you think asdasdasdawd",
},
{
subId: 2,
goes: "Hello 2",
ollo: "Not what you asdasasd",
},
],
},
],
},
];
function getArrayHasValue(obj) {
const keys = Object.keys(obj).filter(accu => Array.isArray(obj[accu]))
return keys[0] ? keys[0] : null;
}
function getObjecNoNested(obj) {
const keys = Object.keys(obj).filter(accu => !Array.isArray(obj[accu]))
return keys
}
function unwindArray(arr, queue,ref) {
for (let i of arr) {
const nestedArrayKayname = getArrayHasValue(i)
const nonNestedKeys = getObjecNoNested(i)

ref = JSON.parse(JSON.stringify(ref)) 

if (nestedArrayKayname) {
nonNestedKeys.forEach(elem => {
ref[`${elem}`] = i[elem]
}) 
unwindArray(i[nestedArrayKayname], queue, ref)
}else {
nonNestedKeys.forEach(elem => {
ref[`${elem}`] = i[elem]
}) 
queue.push(ref)
}
}
return queue
}
console.log(unwindArray(data, [],{}))

Answer 2

试试这个

const yourData = [
{
id: 1,
name: "Something Goes here",
address: "Earth",
arr1: [
{
newId: 1,
title: "Title 1",
midName: "Nothing",
arr2: [
{
subId: 1,
goes: "Hello",
ollo: "Not what you think",
},
{
subId: 2,
goes: "Hello 2",
ollo: "Not what you",
},
],
},
],
},
{
id: 2,
name: "Something Goes",
address: "Mars",
arr1: [
{
newId: 3,
title: "Title sddsdsad",
midName: "Nothing",
arr2: [
{
subId: 2,
goes: "Hello adasdasdasd",
ollo: "Not what you think asdasdasdawd",
},
{
subId: 2,
goes: "Hello 2",
ollo: "Not what you asdasasd",
},
],
},
],
},
];

const tempFunc = (yourData) => {
const result = [];
for(let data of yourData){
const temp ={...data, ...data.arr1[0], ...data.arr1[0].arr2[data.arr1[0].arr2.length-1]};
delete temp.arr1;
delete temp.arr2;
result.push(temp);
}
return result;
};
console.log(tempFunc(yourData));