♦️ 코딩테스트를 조금씩 풀다보니 for each 에 대해 알면 좋을 것 같아서 공부해 보았다.
for each는 for 문과 마찬가지로 반복적인 기능을 수행할 때 사용한다. 하지만 for문 처럼 index와 조건식, increase를 정의하지 않아도 callback 함수를 통해 기능을 수행할 수 있다.
forEach
기본적인 forEach 사용법은 아래와 같다.
const arr = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
arr.forEach(function(element) {
console.log(element); // 0 1 2 3 4 5 6 7 8 9 10
});
arr 객체의 요소들이 callback 함수에 의해 순서대로 호출되는 모습 !
for문에 비해 조금 더 깔끔하고, 직관적이다. index가 증가하는 등의 변칙 없이 arr 내의 모든 요소들이 callback을 호출한다.
forEach(arrow 함수)
arr.forEach(element => console.log(element));
화살표 함수를 사용하는 방법도 있다.
홀수 배열 만들어 보기
forEach는 return이 없다. 즉, callback 함수에 의해서 어떤 결과물을 출력하고 싶으면 함수 밖의 변수를 사용해야 한다.
const arr = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
const oddArray = [];
arr.forEach(function(element) {
if(element % 2 == 1) {
oddArray.push(element);
}
});
console.log(oddArray); // [1, 3, 5, 7, 9]
홀수를 출력할 수는 있지만 함수 밖의 영역은 예상치 못한 예외 상황을 발생시킬 수 있기 때문에 scope 관리를 잘해야 한다.
✏️ 주의점
✔️ for문은 continue나 break로 반복을 제어할 수 있지만 forEach는 예외를 발생시키지 않으면 중간에 반복을 종료할 수 없다.
'TIL > JavaScript' 카테고리의 다른 글
[TIL] Array filter () 함수 (0) | 2023.01.14 |
---|---|
[TIL] map() 함수 (0) | 2023.01.03 |
[TIL] LocalStorage에 대하여 (0) | 2022.12.26 |
[TIL] 문자열 자르는 함수 split() (1) | 2022.12.21 |
[TIL] addEventListener ( ) 함수 ㅡ 이벤트를 처리해 봅시다 (0) | 2022.09.05 |