자바스크립트의 함수에 대해 알아보기 II

함수의 사용 방법과 콜백 함수(Callback Function)에 대해 이전 글에서 알아봤습니다. 이번에는 콜백 함수를 인자로 사용하는 함수에 대해 알아보고자 합니다.

 

자바스크립트의 함수에 대해 알아보기 I

자바스크립트의 함수에 대해 알아보기 I

 

 

 

3. forEach 함수

 forEach 함수는 배열에서만 사용되는 메서드로 배열의 요소들을 반복 사용하는 반복문입니다. 

콜백 함수를 사용하여 forEach를 사용할 때 사용 방법은 아래와 같습니다.

 

     배열 이름. forEach ( function(value, index, array) { } )

 

아래 예제를 통해 forEach 함수에 대해 알아보겠습니다.

 

Visual Studio Code를 열고 아래와 같이 코딩을 작성하고 javascript 파일로 저장합니다.

 

   var arr = ['a', 'b', 'c', 'd', 'e']

 

   arr.forEach(function(value, index){

       console.log(index, value)

   })

 

그리고, 코드를 실행하면 아래와 같은 결과를 얻을 수 있습니다.

 

   0 a
   1 b
   2 c
   3 d
   4 e

 

배열 arr을 선언하였고 요소들을 입력해 주었습니다. 다음 forEach문을 만나 value와 index를 매개변수로 값을 가져옵니다. 여기서 value는 arr 배열의 요소를 입력받게 되며 index는 forEach문의 반복 횟수를 번호로 입력받습니다. 이때 번호는 0부터 시작합니다.

 

4. map 함수

 map 함수도 역시 배열 메서드로 사용되며 주어진 배열의 요소를 매개 변수로 입력받아 함수를 실행하고 결괏값으로 새로운 배열을 만듭니다.

사용방법은 다음과 같습니다.

 

     새로운 배열 = 배열 이름. map ( function(value, index, array) { } )

 

예제를 통해 map 함수에 대해 알아보겠습니다.

 

 

 

Visual Studio Code를 열고 아래와 같이 코딩을 작성하고 javascript 파일로 저장합니다.

 

   let arr = [2, 3, 4, 5, 6]

 

   const arr1 = arr.map(function(value, index){return value + 1})

   console.log(arr1)

 

그리고 코드를 실행하면 다음과 같은 결과를 얻을 수 있습니다.

 

   [ 3, 4, 5, 6, 7 ]

 

배열 arr을 선언하면서 요소를 입력하였습니다.그리고, 배열 arr1을 생성하고 배열 arr의 요소을 매개변수로 불러와 그 값에 1을 더하여 배열 arr1의 요소로 입력하도록 하였습니다. 그리고, 배열 arr1의 요소를 화면에 출력하라는 코딩입니다.

 

5. filter 함수

 filter 함수 역시 배열의 메서드로 콜백 함수의 결괏값이 참인 경우에만 리턴 값으로 반환하여 새로운 배열을 생성하는 함수입니다.

 

사용방법은 다음과 같습니다.

 

    새로운 배열 = 배열 이름. filter ( function(value, index, array) { } )

 

예제를 통해 map 함수에 대해 알아보겠습니다.

 

   let arr = [2, 3, 4, 5, 6]

 

   const arr1 = arr.filter(function(value){return value % 2 == 0})

   console.log('arr 배열 : ' + arr)

   console.log('arr1 배열 : ' + arr1)

 

그리고 코드를 실행하면 다음과 같은 결과를 얻을 수 있습니다.

 

   arr 배열 : 2,3,4,5,6
   arr1 배열 : 2,4,6

 

배열을 선언하면서 요소를 입력하였습니다.

그리고, 배열 arr1을 생성하고 배열 arr의 요소을 매개변수로 불러와 그 값을 2로 나누었을 때 나머지가 0인지를 확인합니다. 나머지가 0인 경우 매개변수의 값을 새로운 배열 arr1의 요소로 입력하라는 코드입니다.