날것 - 표현식과 문

표현식과 문 (Expression and Statement)

모던 자바스크립트 Deep Dive 5장

자바스크립트에서 값이란??
내가 알고있기론 컴퓨터에서의 값이란 컴퓨터 메모리의 특정 주소에 할당된 영역에 2진수로 이뤄진 진짜 값, 혹은 객체의 참조값을 의미함
이 책에서는 어떻게 값을 설명할까 한번 공부해보겠다

값 (Value)

값이란 식이 평가되어 생성된 결과를 말한다

var sum = 10 + 20;

이 코드에서 값은 30이 된다
변수란 하나의 값을 저장하기 위해 확보한 메모리 공간 자체 또는 그 메모리 공간을 식별하기 위해 붙인 이름임
따라서 변수에 할당되는 것은 값이다

변수 sum이 기억하는 메모리 공간에 저장된 것은 10 + 20이 아니라 값 30인 샘

! 갑자기 든 궁금증
전에 공부했던 변수에서는 초기화, 런타임 으로 나뉘어 자바 스크립트 특유의 호이스팅이라는 현상이 발생한다는데 이 10, 20에도 마찬가지로 다음과 같은 방식이 사용될까?
정답은 아니다임
리터럴은 컴파일 단계에서 코드 구조에 포함되지만 실제 값은 런타임에 평가되어 메모리에 생성된다.
리터럴은 선언이 아니므로 호이스팅과 무관하고, 런타임에 해당 코드가 실행될 때 평가된다

책 바로 밑에서 친절히 설명해주고 있는데 삽질함

리터럴 (Literal)

리터럴이란 사람이 이해할 수 있는 문자 또는 약속된 기호를 사용해 값을 생성하는 표기법을 말한다

3

위 숫자 3은 진짜 숫자 3이 아닌 숫자 리터럴임
3 이라고 입력했을때 진짜 값 3을 자바스크립트 엔진이 메모리 공간 상에 생성해준다

자바 스크립트 엔진은 코드가 실행되는 시점인 런타임에 리터럴을 평가해 값을 생성한다
뭐 정수 리터럴, 부동소수점 리터럴 기타 등등 많은 리터럴이 있음

표현식 (Expression)

표현식은 값으로 평가될 수 있는 문임
리터럴은 값으로 평가된다. 따라서 리터럴도 표현식임

예시로

var score = 100;

여기에 100도 값으로 평가되기때문에 표현식임

50 + 50
이것도 표현식이고
score 도 100으로 평가되기때문에 표현식임
함수 호출(ex: foo())도 반환값으로 평가되므로 표현식임 (단, 함수 선언문 function foo() {} 자체는 표현식이 아님)

문 (Statement)

문은 프로그램을 구성하는 기본 단위이자 최소 실행 단위
문의 집합이 바로 프로그램임

문은 또 토큰으로 구성되는데 var sum = 1 + 2; 여기에 있는 var, sum, =, 1, 2, +, ; 모든것이 토큰임

세미콜론과 세미콜론 자동 삽입 기능 (ASI)

세미콜론은 문의 종료를 나타낸다.
단 0개 이상의 문을 중괄호로 묶은 코드블록 뒤에는 세미콜론을 붙이지 않는다.
이는 해당 코드가 자체 종결성을 갖고있어 세미콜론이 없어도 되기 때문

자바스크립트에서는 세미콜론이 옵션인데 이는 자바스크립트 엔진이 소스코드를 해석할때 문의 끝이라고 예측되는 지점에 세미콜론을 자동으로 붙여주는 ASI가 암묵적으로 수행되기 때문임

표현식인 문 vs 표현식이 아닌 문

표현식은 문의 일부일 수도 있고 그 자체로도 문이 될 수도 있다

var x;

이 값은 문은 맞지만 값으로 평가될 수 없다. 왜냐면 선언문이기 때문
따라서 표현식이 아니다

x = 1 + 2;

반면에 이건 표현식이 맞다
x가 3이라는 값을 지니기 때문이다

근데 가장 간단한건 변수에 할당해보기 임

var foo = var x; // SyntaxError 발생함
var foo = x = 100; // 100

이렇게 간단한 방법이!!

핵심 포인트

• 값은 식이 평가된 결과이고, 리터럴은 값을 생성하는 표기법이다
• 표현식은 값으로 평가될 수 있는 문이며, 리터럴/식별자/연산자/함수 호출 등이 해당된다
• 표현식인 문과 표현식이 아닌 문을 구별하는 가장 간단한 방법은 변수에 할당해보는 것이다

참고 자료

• 모던 자바스크립트 Deep Dive (이웅모 저) 5장
• [[변수]]
• [[Hoisting]]