ES6에서 객체의 Key와 Key에 해당하는 Value을 순회하는 코드를 기록해 둡니다.
먼저 순회하려는 객체가 다음과 같다면..
let menus = { 'menu1': { url: 'url(images/menu_icon1.png)', title: 'Menu Item 1', onclick: function() { alert('Menu 1'); } }, 'menu2': { url: 'url(images/menu_icon2.png)', title: 'Menu Item 2', onclick: function() { alert('Menu 2'); } }, 'seprator1': {}, 'menu3': { url: 'url(images/menu_icon1.svg)', title: 'Menu Item 3', onclick: function() { alert('Menu 3'); } }, 'menu4': { url: 'url(images/menu_icon2.svg)', title: 'Menu Item 4', onclick: function() { alert('Menu 4'); } }, };
순회하는 코드는 다음과 같습니다.
for (let [id, menu] of Object.entries(menus)) { if(menu.onclick) { this.addMenu(id, menu.url, menu.title, menu.onclick); } else { this.addSeparator(id); } }
위의 코드에 대한 ES5에서의 동일한 코드는 다음과 같습니다.
for (let id in menus) { let menu = menus[id]; if(menu.onclick) { this.addMenu(id, menu.url, menu.title, menu.onclick); } else { this.addSeparator(id); } }