[자바스크립트]for vs For Each vs Map 의 차이

for와 foreach의 차이

(1) 동기(sync), 비동기(async)의 차이

for는 동기방식이기 때문에 for문 안에 오류가 나면 에러 위치 이후의 이벤트들은 동작하지 않고 멈춰버린다.

foreach는 비동기 방식으로 진행되기 때문에 foreach문 안에 에러가 발생하더라도 멈추지 않고 동작한다. 대신 원하는 순서와는 다르게 프로그램이 동작할 수 있다.

(2) 성능 차이

foreach문은 "향상된 for문"이라 칭하기도 한다. 가변적인 배열이나 리스트 크기를 구할 필요가 없어 복잡한 반복문에 적합하며, 인덱스를 생성하여 접근하는 for문보다 수행속도가 더 빠르다.

 

for문

• 배열의 첫번째 뿐만 아니라 n번째에서 돌 수도 있음
• 단순히 배열을 순회하려는 목적에 비해서 많은 작업이 필요함 (추가적인 변수 선언 및, 증가, 길이 계산 등)

 

forEach 문

• Array 배열에서만 사용가능한 반복문이다. 원소를 나열하여 검사하는 기능이 있다.
• 화살표 함수를 사용하여 각 원소들을 element라는 변수에 담아 forEach문을 돌면서 실행한다. 
• 이 콜백은 호출하는 Array를 변경할 수 있다. forEach문은 구문 밖으로 return값을 받지 못한다.

 

Map 문

 

• map( )은 배열을 순회하면서 배열의 각 원소들을 출력합니다.
• 특이한 점은 forEach( )와 달리  콜백 함수의 반환값들로 구성된 새로운 배열을 반환한다!(forEach와 가장 큰 차이점)
  
  
  

 

결론 !

 

단순 반복이라면 for( ),

배열을 순회하려면 forEach( ),

배열을 순회 후 새 배열을 얻고 싶다면 map( )을

사용하는것이 좋다!