[JavaScript] 함수형 프로그래밍(선언형 프로그래밍, 명령형 프로그래밍)

홍싸리·2023년 5월 17일
0

javascript

목록 보기
3/18

IT 5분 잡학사전 책을 읽으면서 함수형 프로그래밍이 '버그가 발생하기 어려운 구조'라는 것을 알게 되었다.

함수형 프로그래밍이 버그가 숨기 어려운 구조라는데,
1. 함수형 프로그래밍이란 무엇인지,
2. 어떤 이유에서 버그가 숨기 어려운 구조라고 말하는 것인지 찾아보았다.

잠시 당신이 나무꾼이라고 가정해보자. 당신은 숲에서 가장 좋은 도끼를 가지고 있고, 그래서 가장 일 잘하는 나무꾼이다. 그런데 어느 날 누가 나타나서 나무를 자르는 새로운 패러다임인 전기톱을 알리고 다닌다. 이 사람이 무척 설득력이 있어서 당신은 사용하는 방법도 모르면서 전기톱을 사게 된다. 당신은 여태껏 했던 방식대로 시동을 걸지도 않고 전기톱으로 나무를 마구 두들겨댄다. 곧 당신은 이 새로운 전기톱은 일시적인 유행일 뿐이라고 단정하고 다시 도끼를 쓰기 시작한다. 그때 누군가 나타나서 전기톱의 시동 거는 법을 가르쳐 준다.

— 닐포드 , “함수형 사고”


함수형 프로그래밍의 특징

1. 순수함수(Pure function)

  • 동일한 입력에는 항상 같은 값을 반환해야 하는 함수
  • 함수의 실행이 프로그램의 실행에 영향을 미치지 않아야 하는 함수
  • 함수 내부에서 인자의 값을 변경하거나 프로그램 상태를 변경하는 Side Effect가 없는 것
let num = 1;

function add(a){
  return a + num;
}

위와 같은 예제에서는 add라는 함수 안에서 전역으로 선언된 변수인 num을 참조하기 때문에 순수함수라고 볼 수 없다.

//순수함수
function add(a,b){
  return a + b;
}

const result = add(2,3);

위와 같이 add의 함수가 프로그램 실행에 영향을 미치지 않고 입력값에 대해서만 값의 변환이 있으므로 순수함수이다.

순수함수는 프로그램의 변화 없이 입력 값에 대한 결과를 예상할 수 있어서 테스트가 용이하다.


2. 비상태, 불변성(Stateless, Immutability)

  • 함수형 프로그래밍에서의 데이터는 변하지 않는 불변성을 유지해야 한다.
  • 데이터의 변경이 필요한 경우, 원본 데이터 구조를 변경하지 않고 그 데이터의 복사본을 만들어서 그 일부를 변경하고, 변경한 복사본을 사용해 작업을 진행한다.
let person = {name:"jongmin", age:26};

function increaseAge(person){
  person.age = person.age + 1;
  return person;
}

위의 예제에서는 increaseAge 함수에서 전역으로 선언된 personage 속성을 변경하므로 불변성 유지를 만족하지 못한다.

//비상태, 불변성 만족
const person = {name:"jongmin", age:26};

function increaseAge(person){
	return {...person, age:person.age + 1};
}

console.log(increaseAge(person)) //{name:"jongmin", age:27}

위처럼 객체값을 바꾸기 위해서는 데이터의 복사본을 만들어, 그 복사본을 사용해 작업을 진행하고 반환한다.

참고1

let a = ''; //문자열
let b = 0; //숫자
let c = false; //불린
let d = null; //널
let e = undefined; //언디파인드
let f = []; //배열
let g = {}; //객체
let h = function(){}; //함수

참고2

return {...state, }

It does basically two things.

  1. Adds old state properties to the new object by copying all enumerable properties from the state to the {}.
  2. Creates a new computed property with the key that is the result of evaluating action.payload.data._id and sets its value to the result of evaluating action.payload.data.

결국, {...state}는 이전 정보값을 그대로 받아오고(복제) 기존 요소에는 영향을 미치지 않도록 함


3. 선언형 함수(Expressions)

명령형 프로그래밍은 무엇을 어떻게 할 것인가에 주목하고, 선언형 프로그래밍은 무엇을 할 것인가에 주목한다.

let numbers = [1,2,3];

function multiply(numbers, multiplier){
	for(let i=0; i<numbers.length; i++){
      numbers[i] = numbers[i] * multiplier;
    }
}

위 예시는 for문을 사용하여 배열의 각 요소에 multiplier을 곱해주는 명령형 프로그래밍이다.

함수형 프로그래밍에서는 if, switch, for 등의 명령문을 사용하지 않고 함수형 코드로 작성해야 한다.

//선언형 프로그래밍
function multiply(number, multiplier){
  return number.map((num) => num * multiplier);
}
profile
그럴싸한건 다 따라해보는 프론트엔드 개발자 준비중인 6년차 퍼블리셔

0개의 댓글