map, filter, reduce

박한솔·2020년 11월 26일
1

1. arr.map

해당 배열에 추가 설정으로 변경하거나 특정조건을 붙여서 새로운 배열을 만들 수 있다.

let arr = [1,2,3]
arr.map(function(el){
    if (el >1){
        return el*2}
    else{
      return el
    	}
	}
)
// [1,4,6]

arr.map(function(el){
  return el*2})
// [2,4,6]

2. arr.filter

해당 배열의 요소를 논리식을 바탕으로 필터링한다. TRUE면 추가하고 FALSE면 제거한다.

let arr = [1,3,5,6,7,8,9]
arr.filter(function(el){
  return el%2!==0})
// [1,3,5,7,9] --> 6,8은 조건에 false이므로 제거

3. arr.reduce

reduce 함수는 총 5개의 요소로 구성되어있다.
reduce(function(accumulater,currentValue,currentIndex,currentArr),initVal)

acc = 현재 축적되고 있는 값
currentValue = 배열이라면 배열의 값, 객체라면 객체 키의 값
currentIndex = 배열이라면 index, 객체라면 키
currentArr = 배열 전체, 혹은 객체 전체
initVal = 초기값

reduce의 작동 방식은
초기값이 정해졌다면 초기값이, 정해지지 않았다면 arr[0]
혹은 객체의 첫째값이 초기값이 처음 acc가 된다.

acc에 current값들에 대한 식이 성립되고 결과값이 다음 acc가 된다.

//배열의 값 더하기
let arr = [1,2,3,4,5,6]
arr.reduce(function(acc,val){
  return acc + val})
/* 초기값을 정하지 않았으므로 처음 acc는 arr[0], 즉 1
1 + 2 = (3) --> 다음 acc             
3 + 3 = (6) --> 다음 acc
6 + 4 = (10) --> 다음 acc
10 + 5 = 15
15 + 6 = (21) --> 출력값*/

초기값과 논리식을 이용한다면 덧셈 뿐 아니라 논리식에도 쓸 수 있다.

//배열의 최댓값 구하기
let arr = [1,3,2,200,300,100,210]
arr.reduce(function(acc,val){
if (acc<val){
  acc = val
}
  return acc
},0)
/*초기값을 정해주었으므로 처음 acc는 0
처음 acc 0 과 arr[0]을 비교
0<1이므로
다음 acc는 1

1<3이므로
다음 acc는 3

3<2가 아니므로
acc는 3
.
.
.
마지막 acc는 300으로 출력*/

이와 같은 underbar 속성은 함수를 직접 넣어도 사용할 수 있다.

let arr = [1,3,5,6,7,8,9]
let isEven = function(a){
  return a%2===0}
arr.filter(isEven)
/* isEven 함수는 짝수만을 고르는 boolean 함수이므로
[6,8] 만 출력*/
profile
치열하게, 하지만 즐겁게

0개의 댓글