Pure vs Impure Functions
Pure function은 input에 따라 output이 변경되지 않는 값을 내놓는다. 또한 함수 밖의 변수에 영향을 받지 않는다.
const add = (a, b) => a + b
위에서 add 함수는 Pure function이다. 함수에서 받는 parameter a와 b에 따라서 항상 a + b 값을 결과로 반환하기 때문이다.
const NUMBER = 42
const getNumber = (a) => NUMBER * a
위의 getNumber 함수는 Pure function이 아니다. 바깥의 NUMBER라는 변수의 영향을 받고 있기 때문에 항상 같은 결과값을 반환한다고 보장할 수 없다.
이러한 상황에서 우리가 debug를 할 때 다양한 어려움에 겪을 확률이 높아진다. 따라서 함수는 Pure function으로 작성하는 것이 적절하다고 판단할 수 있다.
Functional Programming
Functional Programming을 작성하기 위해선 몇 가지 원칙이 존재한다.
- Don't mutate data
- Use pure functions: fixed output for fixed inputs, and no side effects
- Use expressions and delarations
위의 조건들만 지켜 진다면 우리는 코드를 함수형으로 작성할 수 있다.
Functional Programming in JavaScript
JavaScript에서 함수형 프로그래밍을 작성하기 위해서 Array의 내장 함수를 이용하면 매우 간편하게 작성할 수 있다.
Filter
어떠한 조건에 부합하는 값들을 가진 새로운 배열을 반환한다.
const arr = [1, 2, 3, 4]
const newArr = arr.filter((a) => a % 2 == 0)
filter 안의 callback 함수는 파라미터로 들어오는 값 a에 따라서 짝수인 값들만 반환하는 pure function이다.
Map
기존의 배열을 전부 다 반복하면서 새로운 배열을 반환한다.
const numbers = [1, 2, 3, 4]
const double = numbers.map((v) => v * 2)
forEach
기존의 배열을 전부 다 반복하지만 새로운 배열을 반환하지 않는다.
const numbers = [1, 2, 3, 4]
numbers.forEach((v) => {
console.log(v)
})
reduce
배열의 각 요소에 대해 reducer를 적용한다. 이 때 callback 함수에서 받는 파라미터는 총 5가지 이다.
- accumulator
- currentValue
- currentIndex(op)
- array(op)
- initialValue(op)
const arr = [1, 2, 3, 4]
const result = arr.reduce((acc, cur) => { return acc += cur }, 0)
initialValue가 0 이므로 acc의 초기값은 0에서부터 시작하여 배열의 모든 요소를 더한 최종 값 10을 반환한다.
이처럼 함수형 프로그래밍으로 프로그램을 작성하여 기존 변수에 대한 Side effect가 없도록 구현하는 것이 디버깅에도 좋고 가독성에도 좋다고 생각한다. 따라서 JavaScript를 활용하여 함수형 프로그래밍을 작성할 때 Array의 내장함수를 적절히 사용하여 Side effect를 최소화 하는 것이 옳다.
'IT > JavaScript' 카테고리의 다른 글
Static (0) | 2022.09.12 |
---|---|
Optional chaining (0) | 2022.08.29 |
Shallow copy && Deep copy (0) | 2022.08.11 |
Prototype (0) | 2022.08.02 |
Lexical Environment (0) | 2022.07.30 |