Как перемещаться массив javascript с вложенными объектами в глубину?

Question

var leftArr = [ 
    {'Header': 
     [ 
      {'logo_1':'logo','link_1':'Link1(#Section1)','link_2':'Link2(#Section2)','link_3':'Link3(#Section3)', 
      'link_4':'Link4(#Section4)','link_5':'Link5(#Section5)','link_6':'Link6(#Section6)','link_7':'Link7(#Section7)'} 
     ] 
    }, 
    {'Banner': 
     [ 
      {'image_1':'Banner Image','image_2':'Logo','text_1':'Lead','text_2':'Title','text_3':'Text','clock':'Countdown','link':'Button'} 
     ] 
    }, 
    {'Social Media': 
     [ 
      {'twitter':'Twitter Share', 
      'facebook':'Facebook Share', 
      'google':'Google + Share', 
      'linkedin':'Linkedin Share'}, 
     ] 
    }, 

]; 

Я хочу, чтобы пройти этот массив таким образом, чтобы я мог получить все возможные значения, такие как заголовок, баннер, Social Media, логотип, link1, link2 внутри заголовка и так далее ..

Answer 1

Вы можете перейдите внутрь элементов массива с [index] и внутри свойств объекта с помощью .property (или также с ['property'], если он содержит символы, не поддерживаемые именами переменных или вы хотите, чтобы имя свойства было динамическим).

Так, например, чтобы получить значение Header вы можете:

var value = leftArr[0].Header[0].link_1; 
console.log(value); // Should display 'Link1(#Section1)'; 

Если вы хотите, чтобы сделать его более удобным для чтения, вы можете написать его следующим образом:

var header = leftArr[0].Header[0]; 
var link_1 = header.link_1; 
//You can reuse headers to access other members 
var link_7 = header.link_7; 

Если вы хотите для динамического создания имен собственности вы также можете:

var links = []; 
var header = leftArr[0].Header[0]; 
var i = 0; 
while(header['link_'+i++]) { 
    links[i-1] = header['link_' + i]; 
} 
console.log(links); // Will contain: ['Link1(#Section1)','Link2(#Section2)'....'Link7(#Section7)'] 

Если вы хотите идти в глубину корыта все значения объекта Вы можете:

for (var keyVal in header) { 
    if (header.hasOwnProperty(keyVal)) { 
     console.log(keyVal + ':' + header[keyVal]); 
    } 
} 

Если вы хотите перебрать все элементы в массиве, то:

for (var index in leftArray) { 
    var item = leftArray[index]; 
} 

Вы можете комбинировать их один insde другой для удобства или использовать некоторые рекурсивный напечатать все данные в объекте, как следует:

function printArray(array) { 
    for (var index in array) { 
    console.log(index + ':'); 
    printItem(array[index]) 
    } 
} 

function printObject(obj) { 
    for (var keyVal in obj) { 
    if (obj.hasOwnProperty(keyVal)) { 
     console.log(keyVal + ':'); 
     printItem(obj[keyVal]) 
    } 
    } 
} 

function printItem(item){ 
    if(Object.prototype.toString.call(item) === '[object Array]') { 
    printArray(item); 
    } 
    else if (typeof item === 'object' && item !== null) { 
    printObject(item); 
    } 
    else { 
    console.log(item); 
    } 
} 

printItem(leftArr) 

Здесь у вас есть бегущий plnkr: http://plnkr.co/edit/VE44gGDzsfxgZ6iH4SkG?p=preview