for와 foreach의 차이

• 01.28 1차 피드백을 받고 정리한 내용입니다.

---

api 호출 시 받아온 데이터를 화면에 출력할 때 for문을, 그리고 체크박스 input이 checked되었을 때 일괄 처리를 위해 foreach문을 적용하여 코드를 작성했습니다.

for와 foreach의 차이를 제대로 모르고 단순히, 샘플 코드가 그렇게 작성되어있으니 갖다 쓰는데 그쳤는데, 이번 기회에 그 차이를 공부하게 되었습니다

foreach 사용 지향, for문 사용 지양

---

for문 예시

for(let i =0;i<length;i++) {
	...
}

foreach문 예시

object.forEach(function(var){
	...
});
또는
object.forEach((var)=>{
	...
});

for와 foreach의 차이

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

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

foreach는 ES6 문법으로 콜백함수를 뿌린다. 비동기 방식으로 진행되기 때문에 foreach문 안에 에러가 발생하더라도 멈추지 않고 동작한다. 대신 원하는 순서와는 다르게 프로그램이 동작할 수 있다.
출처: 연습블로그

(2) 성능 차이

foreach문은 "향상된 for문"이라 칭하기도 한다. 가변적인 배열이나 리스트 크기를 구할 필요가 없어 복잡한 반복문에 적합하며, 인덱스를 생성하여 접근하는 for문보다 수행속도가 더 빠르다.
-> 내장함수이기 때문
출처: 열코의 프로그래밍 일기

foreach 사용의 단점

(1) 반복문 내에서 배열이나 리스트 값을 변경하거나 추가할 수 없다
읽기 전용으로 불러오기 때문에 데이터를 수정하는 행위가 불가능하다.

(2) 배열을 역순으로 탐색할 수 없다