如何访问如下结构的对象数组？我想构建一个树来输出数据，如数组中的languages对象，以及使用Object.keys()和map()的嵌套对象。
基本上我想循环遍历每个对象并访问其中的languages对象。
这是我到目前为止所尝试的：
var productMap2 = {};
productMap2 = Object.keys(jsonData[0]).map(function(key) {
return jsonData[0][key];
});
这是我的JSON：
var jsonData = [
{
"id": 1,
"project_name": "Project101-updated TODAY",
"created_by": "John Doe",
"updated_by": "Wes Smith",
"created_date": "2018-01-09T15:49:54Z",
"updated_date": "2018-01-09T15:49:54Z",
"is_deleted": false,
"languages": [
{
"id": 1,
"language": "English",
"created_by": "John Doe",
"created_date": "2018-01-04T04:45:54Z",
"beta_project": 1,
"details": [
{
"id": 1,
"phase_name": "Phase1",
"created_date": "2018-01-04T04:33:00Z",
"created_by": "John Doe",
"phase_title": "Title",
"external_url": "https://wwww.nba.com",
"segment": "Consumer",
"locale": "English",
"is_published": false,
"beta_start_date": "1975-01-01T00:00:00Z",
"beta_end_date": "1975-01-01T00:00:00Z",
"project_owner": "John Doe",
"project_subtitutes": "Gello Tupac",
"last_update_date": "2018-01-04T04:33:00Z",
"last_updated_by": "John Doe",
"last_published_date": "2018-01-04T04:33:00Z",
"last_published_by": "Neil Armstrong",
"accrdn_title_one": "title one",
"accrdn_contents_one": "content one",
"accrdn_title_two": "title two",
"accrdn_contents_two": "content two",
"accrdn_title_three": "title three",
"accrdn_contents_three": "content three",
"accrdn_title_four": "titile four",
"accrdn_contents_four": "content four",
"accrdn_title_five": "title five",
"accrdn_contents_five": "content five",
"accrdn_title_six": "title six",
"accrdn_contents_six": "content six",
"beta_language": 1
},
{
"id": 2,
"phase_name": "Phase2",
"created_date": "2010-10-10T00:00:00Z",
"created_by": "John Doe",
"phase_title": "Title",
"external_url": "https://wwww.nba.com",
"segment": "Consumer",
"locale": "English",
"is_published": false,
"beta_start_date": "2018-01-01T00:00:00Z",
"beta_end_date": "2018-10-20T00:00:00Z",
"project_owner": "John Doe",
"project_subtitutes": "Gello Tupac",
"last_update_date": "2010-10-10T00:00:00Z",
"last_updated_by": "John Doe",
"last_published_date": "2010-10-10T00:00:00Z",
"last_published_by": "Neil Armstrong",
"accrdn_title_one": "title one",
"accrdn_contents_one": "content one",
"accrdn_title_two": "title two",
"accrdn_contents_two": "content two",
"accrdn_title_three": "title three",
"accrdn_contents_three": "content three",
"accrdn_title_four": "titile four",
"accrdn_contents_four": "content four",
"accrdn_title_five": "title five",
"accrdn_contents_five": "content five",
"accrdn_title_six": "title six",
"accrdn_contents_six": "content six",
"beta_language": 1
}
]
},
{
"id": 4,
"language": "Japanese",
"created_by": "John Doe",
"created_date": "2018-01-09T01:35:23.743333Z",
"beta_project": 1
}
]
},
{
"id": 2,
"project_name": "Project102-updated",
"created_by": "Sammy Sosa",
"updated_by": "Wes Smith",
"created_date": "2018-01-05T03:13:08Z",
"updated_date": "2018-01-05T03:13:08Z",
"is_deleted": false,
"languages": [
{
"id": 2,
"language": "Traditional Chines",
"created_by": "John Doe",
"created_date": "2018-01-04T04:46:16Z",
"beta_project": 2,
"details": [
{
"id": 4,
"phase_name": "Phase3",
"created_date": "2018-01-04T04:37:13Z",
"created_by": "John Doe",
"phase_title": "Title",
"external_url": "https://wwww.nba.com",
"segment": "Consumer",
"locale": "English",
"is_published": false,
"beta_start_date": "2010-10-10T00:00:00Z",
"beta_end_date": "2018-01-01T00:00:00Z",
"project_owner": "John Doe",
"project_subtitutes": "Gello Tupac",
"last_update_date": "2018-01-04T04:37:13Z",
"last_updated_by": "John Doe",
"last_published_date": "2018-01-04T04:37:13Z",
"last_published_by": "Neil Armstrong",
"accrdn_title_one": "title one",
"accrdn_contents_one": "content one",
"accrdn_title_two": "title two",
"accrdn_contents_two": "content two",
"accrdn_title_three": "title three",
"accrdn_contents_three": "content three",
"accrdn_title_four": "titile four",
"accrdn_contents_four": "content four",
"accrdn_title_five": "title five",
"accrdn_contents_five": "content five",
"accrdn_title_six": "title six",
"accrdn_contents_six": "content six",
"beta_language": 2
}
]
}
]
},
{
"id": 10,
"project_name": "Project103-updated",
"created_by": "JOHN doe",
"updated_by": "Wes Smith",
"ceated_date": "2018-01-05T03:13:08Z",
"updated_date": "2018-01-05T03:13:08Z",
"is_deleted": false,
"languages": [
{
"id": 3,
"language": "Simplified Chines",
"created_by": "John Doe",
"created_date": "2018-01-09T01:34:26.240000Z",
"beta_project": 10
}
]
}
]
Array.prototype.reduce是一个非常好的工具，既方便又强大，适合这样的任务......
var jsonData = [{
"id": 1,
"project_name": "Project101-updated TODAY",
"created_by": "John Doe",
"updated_by": "Wes Smith",
"created_date": "2018-01-09T15:49:54Z",
"updated_date": "2018-01-09T15:49:54Z",
"is_deleted": false,
"languages": [{
"id": 1,
"language": "English",
"created_by": "John Doe",
"created_date": "2018-01-04T04:45:54Z",
"beta_project": 1,
"details": [{
"id": 1,
"phase_name": "Phase1",
"created_date": "2018-01-04T04:33:00Z",
"created_by": "John Doe",
"phase_title": "Title",
"external_url": "https://wwww.nba.com",
"segment": "Consumer",
"locale": "English",
"is_published": false,
"beta_start_date": "1975-01-01T00:00:00Z",
"beta_end_date": "1975-01-01T00:00:00Z",
"project_owner": "John Doe",
"project_subtitutes": "Gello Tupac",
"last_update_date": "2018-01-04T04:33:00Z",
"last_updated_by": "John Doe",
"last_published_date": "2018-01-04T04:33:00Z",
"last_published_by": "Neil Armstrong",
"accrdn_title_one": "title one",
"accrdn_contents_one": "content one",
"accrdn_title_two": "title two",
"accrdn_contents_two": "content two",
"accrdn_title_three": "title three",
"accrdn_contents_three": "content three",
"accrdn_title_four": "titile four",
"accrdn_contents_four": "content four",
"accrdn_title_five": "title five",
"accrdn_contents_five": "content five",
"accrdn_title_six": "title six",
"accrdn_contents_six": "content six",
"beta_language": 1
}, {
"id": 2,
"phase_name": "Phase2",
"created_date": "2010-10-10T00:00:00Z",
"created_by": "John Doe",
"phase_title": "Title",
"external_url": "https://wwww.nba.com",
"segment": "Consumer",
"locale": "English",
"is_published": false,
"beta_start_date": "2018-01-01T00:00:00Z",
"beta_end_date": "2018-10-20T00:00:00Z",
"project_owner": "John Doe",
"project_subtitutes": "Gello Tupac",
"last_update_date": "2010-10-10T00:00:00Z",
"last_updated_by": "John Doe",
"last_published_date": "2010-10-10T00:00:00Z",
"last_published_by": "Neil Armstrong",
"accrdn_title_one": "title one",
"accrdn_contents_one": "content one",
"accrdn_title_two": "title two",
"accrdn_contents_two": "content two",
"accrdn_title_three": "title three",
"accrdn_contents_three": "content three",
"accrdn_title_four": "titile four",
"accrdn_contents_four": "content four",
"accrdn_title_five": "title five",
"accrdn_contents_five": "content five",
"accrdn_title_six": "title six",
"accrdn_contents_six": "content six",
"beta_language": 1
}]
}, {
"id": 4,
"language": "Japanese",
"created_by": "John Doe",
"created_date": "2018-01-09T01:35:23.743333Z",
"beta_project": 1
}]
}, {
"id": 2,
"project_name": "Project102-updated",
"created_by": "Sammy Sosa",
"updated_by": "Wes Smith",
"created_date": "2018-01-05T03:13:08Z",
"updated_date": "2018-01-05T03:13:08Z",
"is_deleted": false,
"languages": [{
"id": 2,
"language": "Traditional Chines",
"created_by": "John Doe",
"created_date": "2018-01-04T04:46:16Z",
"beta_project": 2,
"details": [{
"id": 4,
"phase_name": "Phase3",
"created_date": "2018-01-04T04:37:13Z",
"created_by": "John Doe",
"phase_title": "Title",
"external_url": "https://wwww.nba.com",
"segment": "Consumer",
"locale": "English",
"is_published": false,
"beta_start_date": "2010-10-10T00:00:00Z",
"beta_end_date": "2018-01-01T00:00:00Z",
"project_owner": "John Doe",
"project_subtitutes": "Gello Tupac",
"last_update_date": "2018-01-04T04:37:13Z",
"last_updated_by": "John Doe",
"last_published_date": "2018-01-04T04:37:13Z",
"last_published_by": "Neil Armstrong",
"accrdn_title_one": "title one",
"accrdn_contents_one": "content one",
"accrdn_title_two": "title two",
"accrdn_contents_two": "content two",
"accrdn_title_three": "title three",
"accrdn_contents_three": "content three",
"accrdn_title_four": "titile four",
"accrdn_contents_four": "content four",
"accrdn_title_five": "title five",
"accrdn_contents_five": "content five",
"accrdn_title_six": "title six",
"accrdn_contents_six": "content six",
"beta_language": 2
}]
}]
}, {
"id": 10,
"project_name": "Project103-updated",
"created_by": "JOHN doe",
"updated_by": "Wes Smith",
"ceated_date": "2018-01-05T03:13:08Z",
"updated_date": "2018-01-05T03:13:08Z",
"is_deleted": false,
"languages": [{
"id": 3,
"language": "Simplified Chines",
"created_by": "John Doe",
"created_date": "2018-01-09T01:34:26.240000Z",
"beta_project": 10
}]
}];
function collectLanguageItemFromProjectList (collector, projectItem) {
var
languageMap = collector.map;
languageList = collector.list;
projectItem.languages.forEach(function (languageItem) {
if (!(languageItem.language in languageMap)) { // registry lookup.
languageMap[languageItem.language] = true; // registry update.
languageList.push(languageItem);
}
});
return collector;
}
var languageList = jsonData.reduce(collectLanguageItemFromProjectList, {
map : {},
list: []
}).list;
console.log('languageList : ', languageList);.as-console-wrapper { max-height: 100%!important; top: 0; }构建树绝对是一个递归任务。但是你的结构中有数组，所以如果你尝试在纸上绘制你的结构，命名每个部分，你的数组的元素将没有名称，或者它们将有数字。
我要做的是根据数组值名称给每个数组元素一个名称（例如，如果您有“languages”数组，从对象中选择“language”属性，并在“details”中选择“phase_name”）并使用在你的树上。
解决方案代码本身取决于预期的树结构。定义这样的结构似乎合乎逻辑：
TreeNode{
'name': string,
'value': string, //null if it has children
'children': [TreeNode], //null if it has value
'expanded': boolean //irrelevant if it has value
}
我之前在我以前的工作场所做过这个，我使用了两个递归转换结构的递归函数（一个用于对象，一个用于数组）但是我有一个不同的数组结构。在这里，确定对象键的值类型并为每个元素调用递归函数并为其创建子元素就足够了。