코드스피츠 스터디 - ES6+ 기초편 1화 일부 내용 정리 및 회고 (2/2)

Soye Park·2023년 1월 7일
0
post-thumbnail

히카맹 선생님의 코드스피츠 강의를 들으며 자바스크립트에 대한 이해를 높이기 위해 스터디를 하게 되었다. 이 포스팅은 그에 대한 정리글이다.

Language Element

자바스크립트에서는 크게 3가지의 요소가 있는데 statement(문), expression(식), identifier(식별자)가 있다.

  • Statement(문)
    - 공문
    - 식문
    - 제어문
  • Expression(식)
    - 값식
    - 연산식
    - 호출식
  • Identifier(식별자)
    - 기본형, 참조형
    - 상수, 변수

1. Statement

공문

공문은 이름 그대로 비어있는 statement로 일반적으로 세미클론으로 구분된다.

if(true);

위의 코드에서 if문의 조건 뒤에는 statement가 와야하나 세미클론만 있다. 이럼에도 자바스크립트는 에러를 반환하지 않는데 이는 세미클론 앞에 비어있는 문, 즉 공문이 있기 때문이다.

식문

식문은 말그대로 Expression이 문이 된 케이스이다. 다른 언어에서라면 에러가 나야할 상황이지만 자바스크립트에서는 식 그 자체를 문으로 인식한다.

if(true)3;

위 코드에서 분명 3이라는 값(식)이 왔음에도 자바스크립트는 에러를 반환하지 않고 3을 반환하게 된다.

제어문

제어문은 뒤에 언급될 sync flow를 제어할 수 있는 statement를 의미한다. 조건을 제어하는 if와 witch문 그리고 루프문(반복문)인 for, while, do-while 문이 이에 속한다. 제어문을 통해 sync flow를 컨트롤할 수 있게되므로 중요.

2. Expression

값식

값은 값 그 자체로 식이다. 위에 있던 식문의 형태에서 3은 값이지만 식이기도 했다. 그리고 뒤에 나올 연산식도 결국 연산이 된 값을 반환하기 때문에 값 그자체이기도 하다.

연산식

연산식은 말그대로 연산을 해야하는 식을 의미한다.

const add = a + b

호출식(call back)

호출식은 함수를 값으로 받아 사용하는 call back을 의미한다.

3. Indentifier

여기서 식별자란 메모리 주소의 이름이라고 생각하면 된다. 우리가 적는 변수, 상수, 함수 이름 등은 메모리에 저장되고 그 메모리 위치는 직관적이지 않은 형태의 숫자로 반환되기 때문에 인간이 해석하기 쉬운 이름을 변수명, 상수명 등으로 지어주는 것이다.

기본형, 참조형

자바스크립트에서 데이터는 크게 두가지로 나뉜다. 값을 그대로 할당하는 기본형 데이터와 값이 아닌 데이터가 담긴 메모리 주소를 참조하는 참조형.
이 때 기본형 데이터는 string, number, boolean, null, undefined, symbol 이 이에 해당되고 참조형 데이터는 object가 해당된다. array와 function 역시 object에 해당된다.

상수, 변수

자바스크립트에서 변수와 상수는 let, const, var가 있는데, 변수는 내부에 있는 값을 실행단계에서 새로 초기화해줄 수 있는 것이고, 상수는 처음 초기화한 값을 변경할 수 없는 것이다. 변수로는 let, var가 있고 상수로는 const가 있다.


느낀 점

Expression과 Indentifier 보다는 Statement에 대해 공부하면서 느낀 점이 많았는데, (평상 시에 제어문이라고 얘기를 했더라도) 제어문을 "한번 실행되면 새로운 흐름이 생성되지 않는 sync flow를 제어할 수 있는 statement"라고 생각하며 개발을 했던 적이 없었기 때문에 굉장히 신선하게 다가왔다. 결국 학습이라는 것은 모르는 것을 알게하는 것에 초점이 있다고 생각하는데, 여태 모르고 마음대로, 혹은 기계적으로 사용했던 경우가 많아 이런 이론적인 측면에서의 학습이 도움이 됐던 것 같다. 그리고 공문이라는 개념도 식문이라는 개념도 처음 본 듯한 개념이었다.


Sync Flow

"Sync Flow, 프로그램은 메모리에 적재되어있는 명령어의 연쇄" 라는 정의였다. 앞서 프로그램이 실행되면 어떤 일이 일어나는 지를 정리했었는데,

메모리에 저장된 명령들이 하나씩 실행되며 외부 버스를 통해 cpu가 해석가능한 언어로 fetch되며 디코더를 통해 해석, 제어유닛을 통해 연산 그리고 값들이 데이터 유닛에 보관 후 메모리에 저장되는 일련의 과정이 (명령이 끝날 떄까지) 무한하게 반복되는 과정을 결국 Sync Flow 라고 부르는 것이었다.

Sync Flow Control

이런 연쇄적 반응들은 명령이 순차적으로 실행되기 때문에 일반적이라면 제어가 되지 않을 것이다. 하지만 위에서 언급된 "제어문"은 결국이 흐름을 제어하기 위한 것이었다. 우리가 아는 제어문의 대표격인 if, switch 와 같은 분기를 나누는 제어문과 반복실행을 가능케하는 반복문이 이 흐름을 제어하기 위해 만들어진 것.

Sub Flow

또 어떤 흐름은 반복해서 사용해야할 때도 있는데, 이 때 함수나 클래스를 이용해 필요한 순간에 Sub 흐름을 만들어 사용도 가능했다.


느낀 점

사실 이번 포스팅의 경우에는 느낀 점보다는 몰랐던 개념들의 용어를 정리하는 데에 그쳤다. 하지만 (이미 그 뒤 강의들도 봤으므로) 이 이후에는 상당 시간 정리를 이해한 부분에 대해서 얘기를 해야할 듯 하다.

Sync Flow를 학습하면서 느꼈던 것은 사실 딱 한가지다. 우리가 프로그래밍을 하면서 고려해야하는 것은 결국 실행흐름을 제어해 의도한 대로 작동하도록 해야한다는 것.

만약 이 흐름을 제대로 통제하고 제어하지 못한다면 그냥 덥썩 끝나버리는 프로그램 또는 무한히 한 분기에서 쳇바퀴 도는 프로그램 등을 보게 될 것이라는 것.

런타임에서 발생하는 많은 문제들에 대해 얻어맞고 밤을 꼴딱 지새게 될 것이라는 점이다.

profile
응애FE개발자/ 블로그 이전 : https://soyeah-log.vercel.app/

0개의 댓글