본문 바로가기

Front-end Developer/Javascript

Javascript - forEach

728x90

Javascript의 'forEach' 메서드는 다음과 같은 상황에서 사용된다.

 

1. 배열의 모든 요소 순회 :  배열의 각 요소에 대해 동일한 작업을 수행해야 할 때 'forEach'를 사용한다.

예를 들어, 배열의 각 요소를 출력하거나, 배열의 각 요소에 대해 계산을 수행하는 등의 작업할 경우

 

array.forEach(function(currentValue, index, arr), thisValue)

 

arry: `forEach`를 호출할 배열이다.

function(currentvalue, index, arr): 배열의 각 요소에 대해 실행할 함수이다.

`currentValue`: 현재 처리 중인 요소의 값이다.

`index`(선택사항): 현재 처리 중인 요소의 인덱스입니다.

`arr`(선택사항): `forEach`rk ghcnfehls qodufdlek.

`thisValue`(선택사항): funtion을 실행할 때 `this`로 사용할 값이다.

 

기본 예시

let fruits = ['사과', '바나나', '체리'];

fruits.forEach(function(item, index) {
    console.log(index, item);
});

 

 

 

화살표함수 사용예시 

      let fruits = ["사과", "바나나", "체리"];

      fruits.forEach((item, index) => {
        console.log(index, item);
      });

 

1. let fruits = ["사과", "바나나", "체리"] -> fruits 변수에 ["사과", "바나나", "체리"]를 선언하였다.

 

-- 화살표 함수 사용

2. fruits.forEach((frutis1, index) => {
     console.log(index, frutis1);
   });

 

-> 배열이 저장된 변수를 가져온다. 그리고 forEach를 사용하여 배열을 한 번씩 순회하도록 한다.

forEach 메서드 내에서 사용하는 콜백 함수명은 item으로 설정한다 (작성자 마음대로)

그리고 index를 통해 현재 처리 중인 요소의 인덱스 번호를 출력한다.

 

 

 

forEach문을 사용한 간단한 예제 문제

 

문제 : 사용자 평가 점수 평균 계산하기

 

당신은 웹사이트의 사용자 리뷰 섹션에 대한 데이터를 가지고 있습니다. 각 리뷰에는 사용자가 제품에 부여한 점수가 포함되어 있습니다. 이 점수들은 배열로 주어져 있으며, 각 점수는 1에서 5 사이의 정수입니다. 당신의 목표는 forEach를 사용하여 이 점수들의 평균을 계산하는 것입니다.

데이터의 예시

let scores = [5, 3, 4, 2, 5, 4, 3, 4, 5, 2];

 

코드 풀이

    <script>
      let scores = [5, 3, 4, 2, 5, 4, 3, 4, 5, 2];
      // 각각의 값들을 집어 넣을 변수를 마련한다
      let sum = 0;

      scores.forEach((item) => {
        // 각각 배열이 잘 나오는지 확인차 출력
        // console.log(item);
        sum += item;

        // 모든 합이 잘 들어가있는지 확인차 출력
        // console.log(sum);
      });

      let avenge = sum / scores.length;
      console.log(`당신의 평균 점수는 ${avenge} 입니다.`);
    </script>

 

 

728x90