[JavaScript] 순수함수

순수함수

순수함수는 외부 상태에 의존하거나 변경하지도 않는, 온전히 독립적인 함수를 말한다.

여기서 외부상태는 전역 변수나 서버 데이터, DOM 등등..

아래와 같은 경우에 모두 해당할 때 순수함수라고 할 수 있다.

• 동일한 입력에 대해 동일한 출력을 반환하는 함수.
• 사이드 이펙트가 없는 함수

 

같은 입력에 대해 같은 출력을 반환하는 함수

순수함수는 늘 같은 입력에 대해 같은 출력을 반환하기 때문에, 인자를 전달받지 않는 함수는 거의 상수 같은 느낌.

외부 상태에 의존하지 않기 때문에 늘 같은 출력을 한다.

아래와 같이 increase() 라는 함수를 만들었을 때, 이 함수는 순수함수라고 할 수 있다.

function increase(n){
    return ++n;
}

console.log(increase(1)); // 2
console.log(increase(1)); // 2
console.log(increase(1)); // 2

인자 1을 넣었을 때 매번 2로 같은 값이 출력되기 때문이다.
이런 점에서 순수함수는 불변성을 가진다고 할 수 있다.

 

 

random() 메서드 같은 경우는 외부 상태에 의존하지 않지만, 호출될 때마다 값이 변하기 때문에 순수함수가 아니다.

Math.random(); // 0.5628074923287576
Math.random(); // 0.3794844323233928
Math.random(); // 0.33897324277365715

 

 

사이드 이펙트가 없는 함수

사이드 이펙트? 🤔

함수에서 값을 반환하는 일 외에 함수 외부의 상태나 변수를 변경하거나 다른 일을 수행하는 것을 말한다.
비동기 처리, 사용자의 입력이나 데이터의 변경, 화면을 그리는 작업 등등

 

순수함수는 인자를 통해서 내부적으로 상태를 변환시켜 출력하기 때문에 사이드 이펙트가 일어나지 않는다.

 

 

순수함수의 장점

• 안정성

실행 시점과 상관없이 늘 동일한 결과를 만들어 내기 때문에 예측할 수 없는 결과가 나올 우려가 없다.
비동기적인 상황이나, 다른 상황에서도 비순수 함수에 비해서 좀 더 안전하다고 할 수 있다.

 

• 조합성

위와 더불어서, 늘 예측할 수 있는 결과이기 때문에 다른 함수들과 조합하여 재사용하기가 좋다.
또 대체로 하나의 기능에 충실하기 때문에 유지보수적인 면에서도 좋다.

 

• 가독성

사이드 이펙트를 지양하고 함수의 복잡성을 떨어뜨리기 때문에 코드를 쉽게 파악할 수 있다는 장점이 있다.

 

 

결국 순수 함수는 사이드 이펙트를 최대한 지양하면서 불변성을 유지하고, 발생할 수 있는 오류를 미연에 방지하여 안정성을 높이기 위한 함수라고 할 수 있을 것 같다.

 

 

출처

모던 자바스크립트 딥다이브
https://seonhyungjo.github.io/Javascript-Book/basic/15-Pure-Functions-Side-Effects-State-Mutation.html