Javascript 如何使用循环从具有相同排列的对象及其子对象获取数据,等等?
我有一个家谱数据,它有一个类似组织结构图的安排 这是数据的安排Javascript 如何使用循环从具有相同排列的对象及其子对象获取数据,等等?,javascript,loops,object,Javascript,Loops,Object,我有一个家谱数据,它有一个类似组织结构图的安排 这是数据的安排 var datasource = { name: "'Adnan", sex: "Male", title: "", generation: 1, children: [ { name: "Ma'ad", sex: "Male",
var datasource = {
name: "'Adnan",
sex: "Male",
title: "",
generation: 1,
children: [
{
name: "Ma'ad",
sex: "Male",
title: "",
generation: 2,
father: "'Adnan",
children: [
{
name: "Nizar",
sex: "Male",
title: "",
generation: 3,
father: "Ma'ad",
children: [
{
name: "Mudhar",
sex: "Male",
title: "",
generation: 4,
father: "Nizar",
children: [
{
name: "Qays 'Aylan",
sex: "Male",
title: "",
generation: 5,
father: "Mudhar",
children: [
{
name: "Khashafah",
sex: "Male",
title: "",
generation: 6,
father: "Qays 'Aylan",
children: [
{
// And so on...
},
]
},
]
},
{
name: "Ilyas",
sex: "Male",
title: "",
generation: 5,
father: "Mudhar",
children: [
{
name: "Mudrikah",
sex: "Male",
title: "",
generation: 6,
father: "Ilyas",
children: [
{
// And so on...
},
]
},
]
},
]
},
]
},
]
},
]
};
我想从数据中提取所有名称,然后将它们放在一个对象中
这就是我一直在使用的代码
function extractData (data) {
var source = data;
// Print out Adnan's name
console.log(source.name);
// Open data Adnan child
var a = source.children;
// Find out how much information on Adnan's children data
for (var key in a) {
// Extract Maad data from Adnan
var b = a[key];
// Print out Maad's name through Adnan
console.log(b.name);
// Open data Maad child through Adnan
var c = b.children;
// Find out how much information on Maad's children data
for (var key in c) {
// Extract Nizar data from Maad
var d = c[key];
// Print out Nizar's name through Maad
console.log(d.name);
// Open data Nizar child through Maad
var e = d.children;
// Find out how much information on Nizar's children data
for (var key in e) {
// Extract Mudhar data from Nizar
var f = e[key];
// Print out Mudhar's name through Nizar
console.log(f.name);
// Open data Mudhar child through Nizar
var g = f.children;
// Find out how much information on Mudhar's children data
for (var key in g) {
// Extract Qays and Ilyas data from Mudhar
var h = g[key];
// Print out Qays's name and Ilyas's name through Mudhar
console.log(h.name);
// Open data Qays child and Ilyas child through Mudhar
var i = h.children;
// Find out how much information on Qays's children and Ilyas's children datas
for (var key in i) {
// Extract Khashafah and Mudrikah data from Qays and Ilyas
var j = i[key];
// Print out Khashafah's name and Mudrikah's name through Qays and Ilyas
console.log(j.name);
// Open data Khashafah child and Mudrikah child through Qays and Ilyas
var k = j.children;
// And so on...
}
}
}
}
}
}
但我不想使用这种方法,因为如果我添加更多的数据,我必须添加更多的代码。那会很累的
我还有另一个家庭数据,我希望能够使用相同的功能
相反,我希望将该代码转换为循环方法。您可以使用递归。
如果有子级,则为每个子级调用递归函数,并将名称
推入数组
注意:要使我的解决方案正常工作,如果一个人没有任何子对象,请完全删除children属性或使children属性具有空数组
var datasource={name:'Adnan',sex:'mal',title:,generation:1,孩子:[{name:'maad',sex:'mal',title:,generation:,generation:,2,父亲:[{name:'Adnan',sex:'Male',title:,generation:,父亲:[{name:'Mudhar',sex:'mal title:,generation:,4,父亲:“Nizar”,孩子:[{name:'Qays'Aylan,sex:'Male',title:',第5代,父亲:“穆德哈”,子女:[姓名:“哈沙法”,性别:“男”,头衔:,[第6代,父亲:“凯斯·艾兰”},{姓名:“伊利亚斯”,性别:“男”,头衔:,[第5代,父亲:“穆德哈”,子女:[姓名:“穆德里卡”,性别:“男”,头衔:,[第6代,父亲:“伊利亚斯”}}]};
设temp=datasource;
const members=[datasource.name];
const getchildrenar=(childrenArr)=>{
如果(!childrenArr)返回;
childrenArr.forEach({name,children})=>{
成员.推送(姓名);
儿童;
})
}
getChildren(datasource.children)
console.log(成员)
这里需要递归。在Javascript中,方法可以调用自身并提交一个参数来执行以下操作:
// store the names here
const names = [];
var datasource = { /* your structure */};
function findNextName(data) {
// store the name in the array
if (data.name) {
names.push(data.name);
}
// call the method again and hand in each child
if (data.children) {
data.children.forEach( child =>
findNextName(child);
)
}
}
// start
findNextName(datasource);
// result
console.log(names);
如果此人没有任何子女,您可以在数组中返回他们的姓名(基本大小写) 如果它们确实有子级,您可以返回一个带有其名称的数组,然后使用映射到每个子级,递归调用
getNames
函数并将结果展平一级。然后可以将它们排列成阵列
const dataSource={name:'Adnan',性别:'mae',头衔:'',世代:1,孩子:[{name:'mad',性别:'mad',头衔:'',世代:2,父亲:'Adnan',孩子:[{name:'Nizar',性别:'Mudhar',性别:'mae',头衔:'',世代:4,父亲:'Nizar',孩子:[{姓名:“凯斯艾兰”,性别:'男性',头衔:'',第五代,父亲:'穆达尔',子女:[{姓名:'哈沙法',性别:'男性',头衔:'',第六代,父亲:'凯斯艾兰',子女:[],},},},{姓名:'伊利亚',性别:'男性',头衔:'',第五代,父亲:'穆达尔',子女:[{姓名:'Mudrikah',性别:'Mean',头衔:'',第6代,父亲:'Ilyas',子女:[],},},],},],},],},],}
const getNames=(person)=>{
如果(!person.children.length){
返回[个人姓名]
}
返回[
person.name,
…person.children.flatMap(getNames)
]
}
const names=getNames(数据源)
log(名称)
您可以使用如下所示的递归来完成
var datasource={name:'Adnan',sex:'mal',title:,generation:1,孩子:[{name:'maad',sex:'mal',title:,generation:,generation:,2,父亲:[{name:'Adnan',sex:'Male',title:,generation:,父亲:[{name:'Mudhar',sex:'mal title:,generation:,4,父亲:“Nizar”,孩子:[{name:'Qays'Aylan,sex:'Male',title:',第五代,父亲:“穆德哈”,子女:[姓名:“哈沙法”,性别:“男”,头衔:,[第六代,父亲:“凯斯·艾兰”,},],[姓名:“伊利亚斯”,性别:“男”,头衔:,[第五代,父亲:“穆德哈”,子女:[[姓名:“穆德里卡”,性别:“男”,头衔:,[第六代,父亲:“伊利亚斯”}]}]};
const getAllNames=(数据,res)=>{
让names=res | |[];
//将名称添加到结果数组中
name.push(data.name);
//如果对象至少有一个子对象,则循环遍历所有对象并
//通过调用函数本身将名称添加到结果对象
//我们可以使用'if(data.children?.length>0)`而不是'if((data.children | |[]).length>0)`但是由于这是一个新功能,它有一些浏览器限制
如果((data.children | |[]).length>0){
data.children.forEach(obj=>{
getAllNames(对象,名称);
})
}
返回姓名;
}
console.log(getAllNames(数据源));
代码没有返回所有的家族成员-Ilyas和Mudrikah丢失。更新了我的代码以使用递归@ArunKumarMohan@FarhanPradanaTallei如果这解决了你的问题,请告诉我,如果你有任何问题,请告诉我。@SomShekharMukherjee我已经检查了所有答案,他们都很好地解决了我的问题,没有任何问题s、 Arun给我的代码中有一些错误,因为在我的数据中有很多人没有孩子。但是在我尝试了他在Nick帮助下提交的新代码后,错误消失了,并且工作正常。一次又一次地创建数组的新副本可能会使程序在大数据集上运行缓慢。很好,哟如果在默认情况下使用解构:constgetnames=({name,children=[]})=>[name,…children.flatMap(getNames)]
@NickParsons非常简洁。感谢您的评论!@NickParsons刚刚用您的解决方案更新了答案。再次感谢:)JFYI,如果任何对象没有任何子对象,则第二个未经分解的片段将中断。我在您的示例中看到,如果没有子对象,它将被视为子对象:[]
但是道具本身可能会丢失。因此,最好使用第三个片段以避免此类问题。