고차함수 정리 (9-13,14)

• 고차함수 코플릿 문제풀기
• 배열 메소드 중 고차함수 알아보기
  (6시간)

고차함수는 배열메소드이다.

• 배열(각 요소)을 함수에 적용시켰을때 결과값이 모든 요소가 출력되는 배열메소드는?
  • map, reduce(응축)

• 배열(각 요소)을 함수에 적용시켰을때 결과값이 모든 요소가 출력되지 않을수도 있는 배열메소드는?
  • filter

• 새로운 배열을 리턴하는 배열 메소드는 어떤게 있을까?
  • map, filter, reduce

filter

• 주어진 조건에 맞는 배열의 요소들만 걸러 새로운 배열에 넣은 배열이 리턴된다.
• 배열의 각 요소가 함수(조건)에 부합(사실)일때 따로 분류한다.

const words = ['spray', 'limit', 'elite', 'exuberant', 'destruction', 'present'];

const result = words.filter(word => word.length > 6);

console.log(result);
// expected output: Array ["exuberant", "destruction", "present"]

forEach

• 배열이 요소를 하나씩 출력한다.

const array1 = ['a', 'b', 'c'];

array1.forEach(element => console.log(element));


// expected output: "a"
// expected output: "b"
// expected output: "c"

find

• 주어진 조건에 맞는 입력배열의 첫번째 요소만을 출력한다.
• 없을땐 undefined가 반환된다.

const array1 = [5, 12, 8, 130, 44];

const found = array1.find(element => element > 10);

console.log(found);
// expected output: 12



const array1 = [5, 10, 8, 10, 4];

const found = array1.find(element => element > 10);

console.log(found);
// expected output: undefined

map

• 배열의 각 요소에 주어진 함수(조건)을 대입하여 호출한 결과를 모아 새로운 배열로 반환한다.
• 하나의 데이터를 다른 데이터로 맵핑(mapping)할때 사용한다.

const array1 = [1, 4, 9, 16];

// pass a function to map
const map1 = array1.map(x => x * 2);

console.log(map1);
// expected output: Array [2, 8, 18, 32]

reduce

• 배열의 각 요소에 리듀서함수(조건)을 실행하고, 하나의 결과값을 반환한다.(여기서 리듀서는 다음에 자세히 다루겠다)
• 배열의 각 요소를 함수(조건)에 따라 하나의 형태로 응축(reduce)한다.

const array1 = [1, 2, 3, 4];
const reducer = (accumulator, currentValue) => accumulator + currentValue;

// 1 + 2 + 3 + 4
console.log(array1.reduce(reducer));
// expected output: 10

// 5 + 1 + 2 + 3 + 4
console.log(array1.reduce(reducer, 5));
// expected output: 15

sort

• 배열의 요소를 적절하게 정렬한 후 그 배열을 반환한다.
• 정렬은 stable sort가 아닐 수 있다.
• 기본 정렬 순서는 문자열의 유니코드(UTF-16 code) 포인트를 따른다.

const months = ['March', 'Jan', 'Feb', 'Dec'];
months.sort();
console.log(months);
// expected output: Array ["Dec", "Feb", "Jan", "March"] - 이게 유니코드순서같다.

const array1 = [1, 30, 4, 21, 100000];
array1.sort();
console.log(array1);
// expected output: Array [1, 100000, 21, 30, 4] - 숫자에서는 우리가 생각하는대로 정렬되지 않는다.

some

• 배열의 요소들을 주어진 함수(조건)을 통과하는데 한개라도 통과되면 true, 다 아닐때에는 false를 출력한다.
• 빈 배열로 함수(조건)을 통과하면 무조건 false를 출력한다.

const array = [1, 3, 5];

// checks whether an element is even
const even = (element) => element % 2 === 0;

console.log(array.some(even));
// expected output: false이다. 
// 그 이유는 array의 3개의 요소 모두 2로 나눌때 나머지가 0이 아니기 때문이다.



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이다.
// 그 이유는 array의 요소 중 조건에 만족하는 요소가 1개 이상이 있기 때문이다. 
// 정확히는 2,4의 요소가 짝수이기 때문이다.

every

• 배열안의 모든 요소가 주어진 함수(조건)을 모두 통과하면 true, 한 요소라도 통과하지 못하면 false를 출력한다.
• 빈 배열을 함수에 적용시키면 무조건 true를 반환한다.

const isBelowThreshold = (currentValue) => currentValue < 40;

const array1 = [1, 30, 39, 29, 10, 13];

console.log(array1.every(isBelowThreshold));
// expected output: true이다. 모두 만족하기 때문이다.


const isBelowThreshold = (currentValue) => currentValue < 40;

const array1 = [1, 30, 39, 29, 100, 13];

console.log(array1.every(isBelowThreshold));
// expected output: false이다. array1요소 중 100이 조건에 맞지 않기 때문이다.