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

남이섬·2021년 6월 8일
0
post-custom-banner

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
즐겁게 살자
post-custom-banner

0개의 댓글