본문 바로가기
JavaScript

[JavaScript] Higher order function

by eddypark 2023. 10. 30.

- 함수를 인자로 전달받거나 함수를 결과로 반환하는 함수를 말한다.

- 인자로 받은 함수를 필요한 시점에 호출하거나 클로저를 생성하여 반환한다.

(1) 고차 함수 종류

- .sort() : 배열의 요소를 오름차 순으로 정렬 Unicode 코드 포인트 순서를 따른다.

- .reverse() : 배열의 요소를 내림차 순으로 정렬한다.

- .foreach() : for문 대신 사용 가능, break문을 사용할 수 없다.

- .map() : 배열을 순회하며 요소의 값을 새로운 값으로 변경한다. 원본은 변경되지 않는다.

- .filter() : 배열을 순회하면서 각 요소에 대해 인자로 주어진 결과가 true인 값만 새로운 배열로 반환한다.

var a = [40, 100, 1, 5, 2, 25, 10];
console.log(a.sort());                           // [1, 10, 100, 2, 25, 40, 5]
console.log(a.reverse());                        // [5, 40, 25, 2, 100, 10, 1]

var b = [1, 4, 9];
console.log(b.map(Math.sqrt));                   // [1, 2, 9]

var c = b.filter(function (x, index, self) {     // 홀수만 뽑기
  return x % 2; 
});
 
console.log(c);                                   // [1, 9]

- .reduce() : 배열을 순회하며 각 요소에 대해 이전 실행 반환값을 전달하여 실행하고 그 결과를 반환한다.

var a = [1, 2, 3, 4, 5];
 
var b = a.reduce(function (x, y) {   // x는 이전값, y는 현재값
  return x > y ? x : y;
});

console.log(b);                      // 5: 최대값

- .some() : 배열 내의 일부 요소들이 콜백 함수를 통과하는지 결과를 boolean으로 반환한다.

var a = [2, 5, 8, 1, 4].some(function (x) {   
  return x > 10;                               // 배열 내 요소 중 10보다 큰 값이 1개 이상 존재하는지 확인
});
console.log(a);                                // false

- .every() : 배열 내의 모든 요소들이 콜백 함수를 통과하는지 결과를 boolean으로 반환한다.

var a = [21, 15, 89, 5, 44].every(function (x) {
  return x > 10;
});
console.log(a);                // false

var b = [21, 15, 89, 5, 44].every(function (x) {
  return x > 5;
});
console.log(b);                // true

- .find() : 배열을 순회하며 콜백함수의 결과가 참인 첫 번째 요소를 반환, 존재하지 않으면 undefined를 반환한다.

- .findIndex() : 배열을 순회하며 콜백함수의 결과가 참인 첫 번째 요소의 인덱스를 반환, 존재하지 않으면 -1을 반환한다.

var a = [10, 20, 30, 40, 100];
 
var b = a.find(function (x) {
  return x>10;
});
console.log(b);                                    // 20
 
b = a.find(function (x) {
  return x<10;
});
console.log(b);                                    // undefined
 
b = a.findIndex(function (x) {
  return x>10;
});
console.log(b);                                    // 1
 
b = a.findIndex(function (x) {
  return x<10;
});
console.log(b);                                    // -1

'JavaScript' 카테고리의 다른 글

[JavaScript] 동기식 처리 모델 vs 비동기식 처리 모델  (0) 2023.10.31
[JavaScript] DOM  (0) 2023.10.30
[JavaScript] Array  (1) 2023.10.26
[JavaScript] String  (0) 2023.10.26
[JavaScript] 정규표현식  (1) 2023.10.24