고차 함수

고차 함수는 인수를 인수로 받거나 함수를 반환합니다. 이를 사용하면 코드를 보다 효율적으로 실행하고 반복성을 줄일 수 있습니다. 그 결과 읽기 쉽고 디버그하기 쉬운 코드가 생성됩니다. 기본 메서드(도우미 함수)를 사용하든, 재귀를 사용하든, 고유한 콜백 함수를 작성하든 이러한 도구를 활용하면 더 나은 프로그래머가 될 수 있습니다.

필터링, 매핑 및 축소
필터, 매핑 및 축소 기능은 대량의 데이터 컬렉션을 처리하는 데 유용한 세 가지 도구입니다. 필터 함수는 배열과 테스트 함수를 인수로 받습니다.

function filter(array, testFunc){
 let results = [];
for(let i = 0; i < array.length; i++){
  if (testFunc(array[i], i, array)) {
    results.push(array[i]);
  }
}
  return results; 
}

이 함수를 호출하면 입력 함수의 조건을 만족하는 값만 있는 새 배열이 반환됩니다. 함수가 호출되면 입력 배열이 반복됩니다. 그리고 각 요소에 대해 입력 함수가 호출되며, true인 경우 배열로 푸시됩니다. 이 함수는 입력 배열을 변경하지 않고 새 배열을 반환하므로 순수한 함수입니다.

let numbers = [2, 3, 5, 18, 21, 22, 27, 33];
console.log(filter(numbers, function(number) {
  return (number % 3 === 0);

여기에서 위에서 만든 필터 함수를 익명 함수로 호출하여 숫자 배열의 각 요소를 테스트하여 3으로 나눌 수 있는지 확인합니다. 이 함수 호출은 [3, 18, 21, 27, 33] 콘솔에 기록됩니다. 또는 다음과 같은 기본 필터 방법을 사용하여 동일한 작업을 수행할 수 있습니다.

let divByThree = function(array){
  let filtered = array.filter(function(element){
    if (element % 3 === 0){
      return element;
    }
   }
  return filtered; 
});
console.log(divByThree(numbers));

기본 방법
네이티브 메서드가 존재하므로 매번 처음부터 함수를 만들 필요가 없습니다. 컬렉션을 반복하는 데 사용되는 맵 함수 1은 입력 함수가 지시하는 방식으로 각각의 모든 요소가 변경되는 입력 배열(또는 개체)에 동일한 길이의 새 배열을 반환합니다. 예를 들어, 배열 내부의 모든 값은 다음 함수로 세제곱될 수 있습니다.

let nums = [1, 2, 3, 4, 5];
let cubeEach = function(array){
  let mapped = array.map(function(element){
    return element ** 3; 
  })
return mapped; 
};
  console.log(cubeEach(nums));

호출되면 백그라운드에서 입력 배열의 각 요소가 함수로 들어가고 세제곱되어 출력 배열로 푸시됩니다. 반복이 완료되면 새 배열이 반환되고 cubeEach = [1, 8, 27, 64, 125] 값이 반환됩니다.

Reduce는 컬렉션을 가져와 하나의 값을 반환하는 또 다른 기본 메서드입니다. 이 함수는 일반적으로 필터 및 맵보다 더 많은 인수를 사용합니다. 일반적으로 3개: 반환되는 값이 될 누산기, 컬렉션의 현재 요소(루핑되는 동안) 및 값을 나타내는 시드 호출 시점의 누산기. 배열의 모든 값의 합계가 필요하다고 가정합니다.

let values = [1, 3, 5, 7, 9];
let addAll = function(array){
  let reduced = array.reduce(function(accumulator, current){
    accumulator += current; 
    return accumulator;
  }, 0); 
  return reduced;
};
console.log(addAll(values));

위의 시드는 함수 본문 뒤에 제공됩니다. 함수가 호출되면 accumulator의 값은 0이고 각 반복마다 증가하고 마지막 요소의 값이 더해진 후 반환됩니다. 여기서 시드에 대한 데이터 유형은 숫자이지만 반환하려는 대상에 따라 문자열, 배열 또는 객체가 될 수 있습니다.

재귀
콜백 함수는 본문에 return 문으로 함수 호출을 포함합니다. 콜백 함수를 포함하면 함수가 실행된 후 값을 보존할 수 있습니다(잠시 후에 클로저에 대해 자세히 설명). 재귀 함수는 호출될 때마다 약간씩 변경되는 하나의 인수를 사용하여 반복해서 다시 호출하는 함수입니다. 아래에서 함수는 입력된 값보다 작거나 같은 모든 양수의 합계를 반환합니다.

function recursiveSum(x, sum = 0){
  //base: when x has a value of 1, return
  if(x === 1){
    return sum + x; 
  }
  if(x < 0){
    return "the number is not positive";
  }
  //recurse: add the value and re-invoke function 
  else {
    sum += x;
    return recursiveSum(x-1, sum); 
  }
}

기본 조건이 충족될 때까지 함수는 매번 감소하는 x 값으로 매번 자신을 다시 호출합니다. 두 번째 인수는 첫 번째 호출에 대해 0으로 설정되지만 함수 본문에서 매번 변경됩니다. recursiveSum(3)이 호출되면 6(3 + 2 + 1)이 반환되는 기본 조건에 도달할 때까지 2번 더 다시 호출됩니다.

여기에 제공된 예제는 매우 간단하고 간단하지만 이러한 방법/기술은 다른 방법과 결합하거나 복잡한 데이터를 처리하도록 확장 및/또는 변경될 수 있습니다. 초보자로서 이러한 것들에 익숙해지는 것은 Javascript 전문가가 되기 위한 유용한 첫 단계가 될 수 있습니다.