6월8일(화) 고차함수 filter(), map(), reduce() 복습

남이섬·2021년 6월 8일

filter()

배열의 filter 메소드는, 모든 배열의 요소 중에서 특정 조건을 만족하는 요소를 걸러내는 메소드이다.

filter 메소드를 이용해 특정 조건을 만족하는 요소만 걸러낸다.

let arr = [1, 2, 3, 4];
let output = arr.filter(짝수);
console.log(output); // ->> [2, 4]

filter 메소드를 이용해 특정 조건을 만족하는 요소만 걸러낸다.

arr = ['hello', 'code', 'states', 'happy', 'hacking'];
output = arr.filter(길이 5 이하)
console.log(output); // ->> ['hello', 'code', 'happy']

특정 조건은 filter 메소드의 인자로 전달 => 때 전달되는 조건은 함수의 형태

filter 메소드는 걸러내기 위한 조건을 명시한 함수를 인자로 받기 때문에 고차함수이다.

!! this - 좀 더 알아보기

this는 현재 실행문맥이다
실행문맥이란 말은 호출자가 누구냐는 것

MDN에서
함수의 this 키워드는 다른 언어와 조금 다르게 동작합니다. 또한 엄격 모드와 비엄격 모드에서도 일부 차이가 있습니다.

대부분의 경우 this의 값은 함수를 호출한 방법에 의해 결정
실행중에는 할당으로 설정할 수 없고 함수를 호출할 때 마다 다를 수 있다.

  Array.prototype.filter = function(func) {
   const arr = this;
    const newArr = []
    for(let i = 0; i < arr.length; i++) {
      if (func(arr[i]) === true) {
        newArr.push(this[i])
     }
    }
    return newArr;
  }

!! forEach, find, filter, map, reduce, sort, some, every - 좀 더 알아보고 익히기 !!

ForEach() - 주어진 함수를 배열 요소 각각에 대해 실행

find() - 주어진 판별함수를 만족하는 첫번째 요소의 값을 반환, 그런 요소가 없다면 undefined를 반환합니다.

const array1 = [5, 12, 8, 130, 44];
const found = array1.find(element => element < 10);
console.log(found); // 5
const array1 = [5, 12, 8, 130, 44];
const found = array1.find(element => element < 5);
console.log(found); // undifined

filter() - 제공된 함수에 의해 구현된 테스트를 통과 한 모든 요솔르 새배열로 만든다.

map() - 요소 각각에 주어진 함수를 호출한 결과를 모아 새로운 배열을 반환

reduce() - 배열의 각 요소에 대해 주어진 리듀서(reducer) 함수를 실행하고, 하나의 결과값을 반환

  • reduce는 배열의 각 요소에 대해 callback을 실행하며 단 1개의 출력 결과를 만든다.

sort() - 배열의 요소를 적절한 위치에 정렬한 후 그 배열을 반환

const months = ['March', 'Jan', 'Feb', 'Dec'];
months.sort();
console.log(months);
// expected output: Array ["Dec", "Feb", "Jan", "March"]

some() - 배열 안의 어떤 요소라도 주어진 판별 함수를 통과 하는지 테스트
빈 배열에서 호출하면 무조건 false를 반환

const array = [1, 2, 3, 4, 5];
// checks whether an element is even
const even = (element) => element % 2 === 0;
console.log(array.some(even));
// expected output: true

every() - 배열 안의 모든 요소가 주어진 판별 함수를 통과하는지 테스트, Boolean 값을 반환합니다.


map() - 모든 요소에게 동일한 행동을 준 값에 대하여 모두 반환
행동은 직접 작성
함수로 작성하여 인자를 넣는다
기존배열을 수정하지 않는다
원하는 행동에 따라서 결과가 달라진다.

map 사용시 기억하기
배열의 각 요소가
특정 논리(함수)에 의해
다른 요소로 지정(map) 합니다.

filter() - 모든 요소 중 내가 원하는 값만 filtering 반환
행동은 직접 작성
함수로 작성하여 인자를 넣는다
기존배열을 수정하지 않는다
원하는 filtering에 따라서 결과가 달라진다.

filter 사용시 기억하기
배열의 각 요소가
특정 논리(함수)에 따르면, 사실(boolean)일때
따로 분류합니다(filter)

reduce() - 배열을 하나의 값으로 만들어 준다.
초기값을 정할 수 있다. 초기 값을 정하지 않으면 배열의 제일 첫번째가 초기 값이 된다. 초기 값은 누적값의 기반이 된다. 그 다음 요소 부터 현재 값이된다. 누적 값과 현재 값은 내가 원하는 행동에 의하여 누적값에 저장
배열의 끝까지 반복한다. 최종 누적값을 반환한다.

만약 초기값을 정한다면 배열의 첫번째 요소가 현재값이 된다.

ADD - reduce는 문자열이나 숫자등을 합치거나 더하거나 뺄수있음
Compare - 제일 작은거 큰거를 비교 할 수있음
Make it diffrent - 배열이외의 다른 형대로 만들 수 있음

reduce 사용시 기억하기
배열의 각 요소를
특정 방법(함수)에 따라
원하는 하나의 형태로
응축한다.(reduction)

profile
즐겁게 살자

0개의 댓글