[JavaScript] for와 forEach의 의문점에서 시작해서 동기와 비동기 기본 개념까지

JSON 사용하는 실습이 반복되다보니

문득 for와 foreach의 정확한 차이를 모르겠다. 

 

for 반복문은 과거 강의에서 지겹게 사용하긴 했다.

for (i = 0; i < rows.length; i++) {
    console.log(rows[i]);
}

forEach 반복문은 살짝 언급만되었고 실제로 자주 사용하지 않았는데

이번 강좌에서는 계속해서 사용된다.

rows.forEach((a) => {
	console.log(a)
})

검색을 통해서 이것저것 쓰는 이유를 찾아보고 싶었다.

왜 동일한 기능을 쓸 수 있는데 이번 기회에 그 차이를 공부하게 되었다.

그런데 아직 이해가 부족하다. 좀더 쉽게 이해하는 방법을 더 찾아봐야겠다.

일단 검색으로 차이점을 찾아보니

 

1. 가장 중요한 차이점이 forEach는 ES6 문법으로 콜백함수를 뿌린다는 점?

for와 foreach의 차이
(1) 동기(sync), 비동기(async)의 차이
for는 동기방식이기 때문에 for문 안에 오류가 나면 에러 위치 이후의 이벤트들은 동작하지 않고 멈춰버린다.
foreach는 ES6 문법으로 콜백함수를 뿌린다. 비동기 방식으로 진행되기 때문에 foreach문 안에 에러가 발생하더라도 멈추지 않고 동작한다. 대신 원하는 순서와는 다르게 프로그램이 동작할 수 있다.

2. 성능 차이

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

 

 

3. forEach 사용의 단점

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

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

 

 

---

 

 

음.. 콜백함수, 동기, 비동기에 대해서 더 찾아봐야겠다.

일단  for의 방식인 i++로 증가되고 .length로 배열의 크기를 찾고.. 이러한 부분이 forEach엔 없어서 수행속도가 빠르다는 것은 이해가 된다.

하지만 오히려 i의 시작점, i++외에 다른 방식으로 배열을 제어 할 수 없기 때문에 forEach와 for를 쓰는 경우를 나눠야 하는 것 같다. for는 오히려 좀 더 까다롭게 반복문을 제어할때 사용되는 것이 좋은 것 같다로 이해한 수준이다.

 

 

*동기와 비동기 나만의 방법으로 쉽게 이해하기

동기	비동기
for	forEach
단일프로세서	다수프로세서
1개가 끝나야 다음것 실행	동시 실행
오류가 나면 에러 위치 이후의 이벤트들은 동작하지 않고 멈춰	에러가 발생하더라도 멈추지 않고 동작
순서대로	그래서 순서대로가 아닐 수 있음
	java 반복문에 마치 continue를 넣은 것 처럼 에러 노상관

 

개념이해 참조자료

https://www.insidepixce.com/dongibidongi

morethan-log

 

---

 

해당 스터디는 아래 깃을 통해 업데이트 되고 있습니다.

https://github.com/yzpocket/Sparta99training

GitHub - yzpocket/Sparta99training