JavaScript의 기능 프로그래밍 파트 1 - 소개

함수형 프로그래밍이란 무엇인가요?

"간단히 말해서 함수형 프로그래밍은 소프트웨어 개발 기능 사용에 중점을 두는 스타일"

책에서 발췌한 내용입니다: 루이스 아텐시오 "함수형 프로그래밍의 JavaScript. 개선하는 방법 JavaScript 기능적 기술을 사용하는 프로그램"

기능 프로그래밍 로 분류됩니다. 선언적 패러다임은 프로그램 설명과 계산이 분리되어 있습니다. 여기서는 표현식을 사용하여 프로그램 논리를 설명하는 데 중점을 둡니다. 이는 필수 프로그래밍을 통해 코드 은 단계별로 실행되며 컴퓨터에게 작업을 완료하는 방법을 자세히 알려줍니다.

선언적 대 명령적, 예시

정수 배열이 있고 각 정수를 2의 거듭제곱으로 올린 다음 짝수가 아닌 값만 선택해야 하는 경우를 생각해 보겠습니다.

필수

const numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9];

const results = []

for(let i = 0; i < numbers.length; i++) {
const secondPower = Math.pow(numbers[i], 2)
if(secondPower & 1) { // 또는 % 2이지만 비트에 대한 연산이 더 빠릅니다.
results.push(secondPower);
}
}

console.log(results) // [1, 9, 25, 49, 81]

의 경우 필수 솔루션을 사용하면 구현 세부 사항에 대한 초점을 명확하게 알 수 있습니다. 루프에서는 요소 수를 제어해야 할 필요성에 따라 배열 인덱스를 볼 수 있습니다. 코드의 세부 사항이 너무 많기 때문에 어떤 작업을 수행하는지에 집중하기가 더 어렵습니다. 이제 선언적 솔루션입니다.

선언적

const risesToSecondPower = (num) => Math.pow(num, 2)
const isOdd = (num) => num & 1;

const numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9]

const results = numbers
.map(risesToSecondPower)
.filter(isOdd);

console.log(results) // [1, 9, 25, 49, 81]

이 솔루션에서는 로직을 함수로 분리하여 구현과 호출을 분리했습니다. 이 솔루션 덕분에 우리는 함수에서 일어나는 일을 설명하는 함수 이름에만 집중할 수 있습니다. 또한 추상화 수준이 높아져 이제 로직을 재사용할 수 있게 되었습니다. 이제 호출에 집중해 보겠습니다. 세부 사항은 보이지 않고 이 코드가 수행하는 작업을 단계별로 알려주는 설명만 보입니다:

1. map(risesToSecondPower) - 배열의 각 요소를 취하여 둘째 거듭제곱으로 올립니다,
2. filter(isOdd) - 필터를 클릭하고 홀수 요소를 선택합니다.

혜택

기능 프로그래밍 에는 많은 이점이 있습니다. 다음과 같은 경우 JavaScript는 함수형 언어이기 때문에 함수를 사용하는 것이 자연스럽습니다. 이 언어의 클래스조차도 "구문 설탕"이며 그 밑에는 함수로 구성되어 있습니다.

가독성과 관련하여 명령형 접근 방식에서 코드는 일반적으로 로직을 파고들지 않고 순차적으로 읽을 수 있는 함수 이름이 나열된 목록이 됩니다. 따라서 구현 세부 사항에 집중하지 않습니다.

또 다른 장점은 불변 객체의 관습을 고수하는 것입니다. 이 접근 방식 덕분에 코드가 더 안전해집니다. JavaScript 는 매우 강력하고 원치 않는 개체를 쉽게 수정할 수 있습니다.

함수형 프로그래밍에서는 코드가 재사용 가능한 추상 코드로 쉽게 생각할 수 있는 작은 함수로 나뉩니다.

순수한 기능

함수형 프로그래밍에서 중요한 고려 사항 중 하나는 순수 함수입니다. 이러한 함수를 만들려면 몇 가지 규칙을 기억해야 합니다:

• 로 설정하면 함수가 반환하는 결과는 입력 매개변수에만 의존합니다,
• 전역 변수와 자신의 범위를 벗어나는 변수를 사용하지 마세요,
• 매개변수의 상태를 변경하지 마세요,
• 순수 함수에는 "부작용"(일반적으로 객체 속성 수정)이 없습니다,
• 를 입력하면 지정된 입력 매개변수에 대해 항상 하나의 동일한 결과를 반환합니다,
• 순수 함수는 항상 매개변수를 취하고 항상 매개변수를 반환합니다.

// 불순한 함수
let counter = 5
...
const multipleCounter = (승수) => {
카운터 = 카운터 * 승수
}

multiplyCounter(2) // -> ? 결과는 초기값에 따라 달라집니다.

// 순수 함수
const multiplyBy = (곱하기) => (값) => 값 * 곱하기
const multipleByTwo = multiplyBy(2)

const counter = multiplyByTwo(5) // -> 10

첫 번째 함수는 변경될 수 있는 외부 매개변수에 의존하기 때문에 예측이 불가능합니다. 두 번째 함수는 입력 매개변수에만 의존하고, 수정하지 않으며, 범위를 벗어난 변수를 사용하지 않으므로 투명합니다. 세 번째 함수는 매개변수에 의존하고, 수정하지 않으며, 범위를 벗어난 변수를 사용하지 않고, 새 값을 반환하기 때문에 투명합니다.