안녕하세요 웹 프론트엔드 개발자 설탕시럽입니다.
본 글에서는 자바스크립트로 배우는 SICP를 읽은 후, 개별적으로 학습한 내용을 정리하여 습득된 지식을 정리할 겸 공유드립니다. 따라서 글의 주제나 소 주제에 대해서는 책과 같은 흐름으로 소개드리며 참고한 내용들에 대해서는 아래 레퍼런스를 남겨놓았습니다.
계산적 과정
계산적 과정, computational process
책을 통해 앞으로 다루어 지는 내용은 계산적 과정에 대한 내용입니다. 계산적 과정이란 데이터를 조작하는 하나의 추상적인 개념입니다. 실존하지만 추상적인 과정을 규칙에 맞게 구현된것이 프로그램이고 프로그램은 프로그래밍 언어로 만들어 집니다.
프로그램은 프로그래밍 언어로 작성된 과정 속에 컴퓨터 내부에서 정확하게 동작하기 때문에 개발자는 자신이 만든 과정이 어떤 일을 하는지 명확하게 인지해야 합니다. 만약 그렇지 못한다면, 예측할 수 없는 결과가 나오거나 디버깅에 어려움을 겪는 등의 문제가 발생할 수 있습니다.
따라서 숙련된 개발자라면, 자신이 작성한 프로그래밍 언어로 만들어진 계산적 과정이 어떻게 수행되는지 명확하게 인지하고 있으며, 의도대로 잘 진행될 수 있게 프로그램을 조직화한다던가, 모듈식으로 잘 분리하여 작성 및 디버깅에 용이한 프로그램을 만들 수 있습니다.
프로그래밍 기본 요소
책에서는 강력한 프로그래밍 언어라는 명칭으로 컴퓨터가 수행할 과제를 지시하는 수단 그 이상으로, 과정에 대한 생각을 조직화하는 틀로 작용한다고 말합니다. 과제를 해결하기 위해 개발자가 과정을 생각하고 이를 프로그램으로 만들기 위한 수단이 되는 것입니다. 프로그래밍 언어는 세 가지 메커니즘을 제공합니다.
- 원시 표현식, primitive expression : 언어와 관련된 가장 단순한 개체
- 조합, combination 수단 : 단순한 요소들로부터 복합적인 요소를 만드는데 쓰인다.
- 추상화, abstraction 수단 : 복합적인 요소들에 이름을 붙여서 하나의 단위로 다루는 데 쓰인다.
세 가지 메커니즘을 통해 강력한 프로그래밍 언어에서 사용할 수 있는 함수와 데이터를 다룰 수 있습니다. 기본적으로 원시 데이터와 원시 함수를 서술할 수 있어야 하고, 함수와 데이터를 조합하고 추상화할 수 있는 수단이 있어야 합니다.
표현식
자바스크립트에서는 표현식과 문이라는 두 가지 문법이 존재합니다.
문, Statement : 프로그램을 구성하는 기본 단위이자, 최소 실행 단위
표현식, Expression : 값으로 평가될 수 있는 문
이러한 문을 과정에 맞게 작성하여 구현된 것이 프로그램입니다. 그리고 위에 작성된 바와 같이 값으로 평가될 수 있는 문을 표현식이라고 합니다. 문과 표현식에 관한 자바스크립트 예제 코드는 아래와 같습니다.
var A = 10;
10; //표현식
위 예제코드의 표현식 10은 앞서 설명한 원시 표현식 중 number 형태입니다. 원시 표현식을 조합하여 복합적인 요소를 만들기 위해 다양한 수단을 제공하나, 간단하게 number에 대해 사칙연산을 제공합니다.
10 + 20;
(7 * 2) + (10 - 4)위 예제코드처럼 다른 표현식을 구성요소로 담고 있는 표현식을 조합, 연산자와 피연산자가 중위 표기법(자바스크립트 연산자 조합 표기법)으로 되어 있는 형태를 연산자 조합이라고 합니다.
자바스크립트 해석기는 항상 REPL, read evaluate print loop로 동일하게 동작합니다. REPL이란 사용자가 입력한 문장을 읽고(READ), 평가한 후(Evaluate), 출력하는 (PRINT) 주기를 말합니다.
변수
프로그래밍 언어에서 위에서 설명드린 표현식, 그 외 객체에 대해서 이름을 붙이는 것을 변수 라고 하며, 이는 필수 기능에 해당됩니다. 자바스크립트에서 또한 변수를 선언하기 위해 var, let, const와 같은 기능을 제공하고 이 중 const를 사용하여 상수와 이전에 설명드린 추상화에 대해 소개드리려고 합니다.
var width = 100;
var height = 200;
const size = width * height;위 예제 코드에서 변수들은 모두 const로 선언되었습니다. const는 상수를 선언하는 방법으로 해당 객체의 값을 지칭하며, 변하지 않을 객체, 값을 가리킨다.
width와 height을 곱한 복합 연산의 결과를 size라는 이름으로 지칭할 수 있다는 점에서, 상수 선언은 가장 단순한 추상화 수단이다. 지금의 예제 코드는 width와 height을 곱하는 정도이지만 추후 프로그램에서 객체는 복잡할 수 있고, 복잡한 구조를 기억해 놓고 사용하는 것은 불편하고 에러를 많이 발생시키는 원인이 될 수 있다.
연산자 조합의 평가
절차적 사고, Procedual Thinking
문제를 효율적으로 해결하기 위해 문제를 작은 단위로 잘게 나누고 각각의 문제를 단계별로 처리하는 사고 과정
자바스크립트 해석기가 연산자 조합을 평가할 때, 어떤 절차적 사고 과정을 통해 평가하는지 살펴봅니다.
- 조합의 피연산자 표현식들을 평가
- 연산자가 나타내는 함수를 인수(피연산자들 값)에 적용
해석기는 단순하지만 위 두 과정을 거치면서 연산자 조합을 평가한다. 우선 첫 번째 단계를 수행하기 위해 피연산자 표현식들을 평가, 즉 평가를 위해 평가를 하기 위해 재귀적 규칙으로 진행됩니다. 우선 연산자 조합의 예시를 들어 보겠습니다.
(2 + 4 * 6) * (3 + 12)위 연산자 조합을 평가하기 위해서 2 + 4 * 6과 3 + 12를 평가해야 합니다. 또 왼쪽 연산자를 평가하기 위해 4 * 6을 우선순위에 따라 먼저 평가해야 합니다. 위 코드는 이 정도 깊이에서 그치지만 복잡한 구조가 될수록 평가하기 위해 재귀를 하게 되고, 이는 조합이 아니라 원시 표현식을 평가해야 하는 지점까지 도달하게 됩니다.
원시 표현식 상태까지 왔다면 수치를 평가해야하는 경우 그 값을 사용하고, 변수 이름을 평가할 때는 연관된 객체로 평가하게 됩니다.
이렇게 첫 번째 단계를 거쳐 피연산자 표현식들이 평가되었다면, 두 번째 단계로 넘어가게 됩니다. 두번째 단계에서 연산자가 나타내는 함수에 평가된 피연산자들을 넣어 적용하여 연산자 조합의 평가가 끝이 나게 됩니다.
마치며
기껏해야 컴파일러, 인터프리터 정도 그 이상 프로그램 구조와 원리에 대해 깊이 있게 접근하거나 개념과 정의를 학습을 하지 않아서 코딩과 다른 방향으로 머리가 아픈 느낌이었습니다. 연산자 조합의 평가 과정까지 살펴볼 수 있는 유익하면서도 머리가 조금 지끈거리는 시간이었습니다.
References
[모던 자바스크립트 Deep Dive] :