지난 주 부터 명령형이 아닌 선언형, 특히 함수형으로 코드를 작성하고 데이터를 가공하는 법을 배우고 있다! 상태를 가지지 않는다는 점 (상태가 없어 사이드 이펙트가 없다) 이 낯설긴 했지만, 구조가 단순하여 가독성이 높으며, 다양한 이터러블한 객체들에 사용가능하고, 지연평가(Lazy) 된다는 특징이 있다. 수업을 제공해 주시는 유인동님께서 사용하시는 FxJS를 사용하고 있는데, 다른 함수형이 지원하지 않는 Promise도 지원이 된다고 한다!
Marpple에서 사용하는 함수형 라이브러리 FxJS 보러가기👀
이번주 로토님이 진행하는 수업을 들으며 역시나 등장한 선언형!
선언형으로 컴포넌트를 작성해보며, 확실히 선언형으로 코드를 작성하는게 유지보수하는 데 있어 편리한 것을 깨닫게 되었다.
나는 프로그래밍을 공부한지 얼마 안된 코린이기 때문에 다시 배웠던 한번 프로그래밍 패러다임들 개념을 짚고 넘어가자.
프로그래밍 패러다임
프로그래밍 패러다임은 프로그래머에게 프로그래밍의 관점을 갖게 해 주고, 결정하는 역할을 한다. 예를 들어 객체지향 프로그래밍은 프로그래머들이 프로그램을 상호작용하는 객체들의 집합으로 볼 수 있게 하는 반면에, 함수형 프로그래밍은 상태값을 지니지 않는 함수값들의 연속으로 생각할 수 있게 해준다.
선언형 프로그래밍과 반대되는 개념으로, 프로그래밍의 상태와 상태를 변경시키는 구문의 관점에서 연산을 설명하는 프로그래밍 패러다임의 일종이다. 즉, 컴퓨터가 수행할 명령들을 순서대로 써 놓은 것이다.
때때로 명령형 프로그래밍과 동의어로 쓰이기도 하지만, 수행되어야 할 연속적인 계산 과정을 나타내는 프로시저 호출의 개념을 바탕으로 하고있다.
컴퓨터 프로그램을 명령어의 목록으로 보는 시각에서 벗어나 여러 개의 독립된 단위, 즉 "객체"들의 모임으로 파악하고자 하는 것이다. 각각의 객체는 메시지를 주고받고, 데이터를 처리할 수 있다.
관련키워드 :
추상화(Abstraction)
,캡슐화(Encapsulation)
,상속(Inheritance)
,다형성(Polymorphism)
프로그램이 어떤 방법으로 구현해야 하는지(명령형) 를 나타내기보다 무엇을 나타내야 하느냐에 초점을 맞춰 설명하는 경우에 "선언형"이라고 한다. 명령형과 반대되는 개념이다.
예를 들어 HTML로 웹페이지를 작성한다고 하면, 우리는 페이지가 HTML에서 무엇을 보여주어야 하는지 다양한<tag>
를 통해 선언한다. 그 후 브라우저의 절차적 알고리즘이 알아서 화면에 표시할 점들로 변환한다.
명령형 프로그래밍에서는 상태를 바꾸는 것을 강조하는 것과는 달리, 함수형 프로그래밍은 함수의 응용을 강조한다.
일급객체(First-class Object)란 다른 객체들에 일반적으로 적용 가능한 연산을 모두 지원하는 객체를 가리킨다.JS에서는 함수가 일급객체이다.
이는 함수를
- 기존 명령형 프로그래밍 : 문제를 어떻게 해결해야 하는지 컴퓨터에게 명령을 내리는 방법
- 선언형 프로그래밍 : 무엇을 해결해야 할지 집중하고 해결방법은 컴퓨터에게 위임하는 방법 →먼저 무엇이 필요한지 분석, 필요한 요구사항만 명령
- 선언형을 위해 문제를 쪼개어 분석할때, 함수형 프로그래밍이 빛을 본다.
// 어떻게 해결해야 하는지 에 대한 묘사 (명령형 - 절차지향)
function double(arr) {
let results = [];
for (let i = 0; i < arr.length; i++) {
if (typeof arr[i] === 'number') {
results.push(arr[i] * 2);
}
}
return results;
}
console.log(double([1, 2, 3, '', null, 6])); // [ 2, 4, 6, 12 ]
// 무엇을 원하는지에 대한 묘사 (선언형 - 함수형)
function double(arr) {
return arr.filter(param => typeof param === 'number')
.map(number => number * 2);
}
console.log(double([1, 2, 3, '', null, 6])); // [ 2, 4, 6, 12 ]