모던 자바스크립트 Deep Dive 5: 표현식과 문

값이란 무엇인가?

값이란 표현식이 평가되서 생성된 결과를 말한다.

모든 값은 데이터 타입을 갖는데 메모리에 저장된 똑같은 이진수 값이라도 데이터 타입에 따라 이진수 값이 해석되는 결과가 다르다.

예를 들어, 메모리에 0100 0001이란 이진수 값이 저장되어있다고 하자. 이 값의 데이터 타입이 number이면 65지만 string이면 "A"이다.

값을 변수에 할당하려면 표현식이 평가가 되어야한다.

다음과 같은 코드가 있다.

var sum = 10 + 20;

위 코드는 저번에 변수에 어떻게 값이 할당되는지에 대해 표현식 관점에서 설명하자면 다음과 같다.

10 + 20이란 표현식이 평가되어서 30이란 결과 값이 생성되어 sum이 참조하고있는 메모리 공간에 저장된다.

따라서 30이란 값이 sum 변수에 할당하기 위해서는 10 + 20 표현식이 평가가 되어야한다.

리터럴

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

예를 들어, 숫자 리터럴 값 5를 코드에 작성하면 자바스크립트 엔진은 5라는 표현식을 평가해 5를 메모리에 저장한다.

리터럴 값을 평가하는 시점은 런타임 때이다.

표현식

먼저, 표현식에 대한 정의를 내리면 다음과 같다.

표현식은 값으로 평가될 수 있는 문(statement)이다. 표현식이 평가되면 새로운 값을 생성하거나 기존 값을 참조한다.

정의를 읽어보면 무슨 말인지 감이 잘 안온다. 예를 들면 다음과 같은 문(statement)가 있다고 하자

var score = 100;

위 코드에서 100은 리터럴이다. 자바스크립트 엔진은 100을 평가되어 100이란 값을 score가 참조하고 있는 메모리 공간에 저장한다. 따라서 리터럴은 표현식이다.

var score = 50 + 50;
score;

위 코드에서 자바스크립트 엔진이 50 + 50을 평가되어 결과 값 100을 score가 참조하고 있는 메모리 공간에 저장한다. 따라서 50 + 50은 표현식이다.

두번째 라인인 score;문은 자바스크립트 엔진이 변수가 참조하고 있는 메모리에 저장된 값으로 평가된다. 즉, 식별자 선언이 된 식별자 참조하는 문도 표현식이다.

위의 두가지 예시로 알 수 있는건 값으로 평가될 수 있는 문은 모두 표현식이라는 것이다.

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

문에는 표현식인 문과 표현식이 아닌 문이 있다. 다시 말해 값으로 평가될 수 있는 문은 표현식인 문이고, 값으로 평가될 수 없는 문은 표현식이 아닌 문이다.

이걸 구별하는 방법은 변수에 할당해 보는 것이다. 표현식인 문은 값으로 평가되기 때문에 변수에 할당할 수 있고, 표현식이 아닌 문은 값으로 평가할 수 없으므로 변수에 할당할 수 없다.

var x;
x = 100;
var foo = var x; // Error

위의 코드에서 2번째 라인은 변수에 할당할 수 있다. 그 이유는 100이란 리터럴 값이 표현식이기 때문이다.

반면, 3번째 라인에서 에러가 발생한다. 그 이유는 var x문은 값으로 평가될 수 없는 문이기 때문이다.

var foo = (x = 100);
console.log(foo);

위의 결과는 foo에 100이라는 결괴값이 출력된다. 그 이유는 x = 100문은 표현식이다. 즉, 값으로 평가될 수 있기 때문에 1번째 라인은 값으로 평가될 수 있는 문이다.