javascript forEach 사용시 주의사항
3월 29, 2023
In Javascript |
## javascript forEach 사용시 주의사항 angularjs 로 프로젝트를 하던 중 정말 당황한 내용이 있어 정리합니다. angularjs 라고는 해도 javascript 문법에 해당하며 아마도 자주 사용할 것으로 생각되는 forEach에 대한 내용입니다. 일단 제가 구현하고자 했던 내용은 다음과 같습니다. * registry.menus에 여러 menu 메뉴 정보가 배열로 들어 있고 각 menu 별로 id가 지정되어 있는 데이터가 있음 * 함수의 파라메터로 id를 넘겨 데이터에 있는 menu.id 와 일치하면 해당되는 item을 리턴하도록 구현 저는 일반적인 for문을 생각하고 너무나 당연하게 아래와 같은 함수를 작성했지만 실제 결과는 계속해서 Not found가 로그에 찍혔습니다. ``` function functionA(id) { if (registry) { if (id) { registry.menus.forEach((menu, index, array) => { if (menu.id === id){ return menu.item; } }); console.error("Not found : " + id); return null; } } return null; } ``` 아무리 console.log로 값을 찍어 보고, name과 menu.name의 타입을 비교해 봐도 id는 동일한데 말입니다. 한두시간정도 고민하다 도저히 이해가 가지 않아 옆자리 후임에게 물어 봤습니다. 본인 : "난 도저히 이해할 수 없다. 이거 왜 그런거냐?" 후임 : "혹시 return menu.items 에서 return 이 forEach만 빠져나오는 것은 아닐까요?" 바로 log를 찍어 봤습니다. 본인 : "..... 너 정말 대단하구나!" 결국 아래와 같이 수정했습니다. ``` function functionA(id) { if (registry) { if (id) { var item; registry.menus.forEach((menu, index, array) => { if (menu.id === id){ item = menu.item; return; } }); if(item){ return item; } else{ console.error("Not found : " + id); return null; } } } return null; } ``` java, c 로 개발하시다 javascript를 접하시는 개발자분들께서 같은 고생 하지 않으시길 빕니다. ^^