📌 값

식(표현식)이 평가 되어 생성된 결과

평가❓
식을 해석해서 값을 생성하거나 참조하는 것

[예제 5-1]

// 10 + 20은 평가되어 숫자 값 30을 생성한다.
10 + 20; // 30

모든 값은 데이터 타입을 가지며,
메모리에 2진수, 즉 비트의 나열로 저장됨

메모리에 저장된 값은 데이터 타입에 따라 다르게 해석될 수 있다.
ex) 메모리에 저장된 값 0100 0001을 숫자로 해석하면 65지만, 문자로 해석하면 'A'다.

변수는 하나의 값을 저장하기 위해 확보한 메모리 공간 자체, 또는 그 메모리 공간을 식별하기 위해 붙인 이름
➡️ 변수에 할당되는 것은 값

[예제 5-2]

// 변수에는 10 + 20이 평가되어 생성된 숫자 값 30이 할당된다.
var sum = 10 + 20;

위 예제의 sum 변수에 할당되는 건 10 + 20이 아니라, 10 + 20이 평가된 결과인 숫자 값 30이다.

➡️ 즉, 변수 이름 sum이 기억하는 메모리 공간에 저장된 것은 10 + 20이 아니라 값 30이다.

따라서 10 + 20은 할당 이전에 평가되어 값을 생성해야 한다.

값을 생성하는 방법은, 위와 같은 식도 있지만 가장 기본적으로 리터럴을 사용하는 방법이 있다.

📌 리터럴

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

[예제 5-3]

// 숫자 리터럴 3
3

위 예제의 3은 단순한 아라비아 숫자가 아니라, 숫자 리터럴이다.

사람이 이해할 수 있는 아라비아 숫자를 사용해, 숫자 리터럴 3을 코드에 기술하면 자바스크립트 엔진은 이를 평가해 숫자 값 3을 생성

[그림 5-1]

이처럼 리터럴은 사람이 이해할 수 있는 문자(아라비아 숫자, 알팝멧, 한글 등) 또는 미리 약속된 기호로 표기한 코드다.

자바스크립트 엔진은 코드가 실행되는 시점인 런타임에 리터럴을 평가해 값을 생성
➡️ 리터럴은 값을 생성하기 위해 미리 약속한 표기법

📌 표현식

값으로 평가될 수 있는 문
즉, 표현식이 평가되면 새로운 값을 생성하거나 기존 값을 참조

리터럴은 값으로 평가된다.
따라서 리터럴도 표현식이다.

[예제 5-4]

var score = 100;

위 예제의 100은 리터럴

리터럴 100은 자바스크립트 엔진에 의해 평가되어 값을 생성
➡️ 리터럴은 그 자체로 표현식

[예제 5-5]

var score = 50 + 50;

50 + 50은 리터럴과 연산자로 이뤄져 있다.
하지만 평가되어 숫자 값 100을 생성하므로, 표현식이다.

[예제 5-6]

score; // 100

변수 식별자를 참조하면, 변수 값으로 평가된다.
식별자 참조는 값을 생성하지는 않지만 값으로 평가되므로 표현식이다.

이처럼 표현식은 리터럴, 식별자(변수, 함수 등의 이름), 연산자, 함수 호출 등의 조합으로 이뤄질 수 있다. 값으로 평가될 수 있는 문은 모두 표현식이다.

[예제 5-7]

// 리터럴 표현식
10
'Hello'

// 식별자 표현식(선언이 이미 존재한다고 가정)
sum
person.name
arr[1]

// 연산자 표현식
10 + 20
sum = 10
sum !== 10

// 함수/메서드 호출 표현식(선언이 이미 존재한다고 가정)
square()
person.getName()

표현식은 값으로 평가된다.

표현식과 표현식이 평가된 값은 동등한 관계, 즉 동치다.

따라서 표현식은 값으로 사용할 수 있다.
➡️ 문법적으로 값이 위치할 수 있는 자리에는 표현식도 위치할 수 있다는 것을 의미

예를 들어 산술 연산자 +의 좌항과 우항에는 숫자 값이 위치
➡️ 숫자 값으로 평가될 수 있는 표현식이라면, 숫자 값 대신 사용할 수 있다.

[예제 5-8]

var x = 1+ 2;

// 식별자 표현식 x는 3으로 평가된다.
x + 3; // 6

위 예제의 x+3은 표현식이다.

• 연산자는 좌항과 우항의 값을 산술 연산하는 연산자이므로 좌항과 우항에는 숫자 값이 위치해야 한다.

이때 좌항 x는 식별자 표현식이다.
즉, x는 할당되어 있는 숫자 값 3으로 평가된다.
따라서 숫자 값이 위치해야 할 자리에 표현식 x를 사용할 수 있다.

이처럼 표현식은 다른 표현식의 일부가 되어 새로운 값을 만들어낼 수 있다.

📌 문

프로그램을 구성하는 기본 단위이자 최소 실행 단위다.

문의 집합으로 이뤄진 것이 바로 프로그램,
문을 작성하고 순서에 맞게 나열하는 것이 프로그래밍

문은 여러 토큰으로 구성된다.
토큰이란, 문법적인 의미를 가지며, 문법적으로 더 이상 나눌 수 없는 코드의 기본 요소를 의미한다.

예를 들어, 키워드, 식별자, 연산자, 리터럴, 세미콜론, 마침표 등의 특수 기호는 문법적인 의미를 가지며, 문법적으로 더 이상 나눌 수 없는 코드의 기본 요소이므로 모두 토큰이다.

[그림 5-2]

문은 명령문이라고도 한다.(여기서 이해가 됨, 아하)
즉, 컴퓨터에 내리는 명령이다.

선언문, 할당문, 조건문, 반복문 등...

📌 표현식인 문과 표현식이 아닌 문

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

[예제 5-11]

// 변수 선언문은 값으로 평가될 수 없으므로 표현식이 아니다.
var x;
// 1, 2, 1 + 2, x = 1 + 2는 모두 표현식이다.
// x = 1 + 2는 표현식이면서 완전한 문이기도 하다.
x = 1+ 2;

이처럼 표현식과 문은 비슷해서 구별하기 어려워 보인다.

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

예를 들어 변수 선언문은 값으로 평가될 수 없다.
➡️ 표현식이 아니 문이다.

할당문은 값으로 평가될 수 있다.
➡️ 표현식인 문이다.

표현식인 문과 표현식이 아닌 문을 구별하는 가장 간단하고 명료한 방법은 변수에 할당해 보는 것이다. 표현식인 문은 값으로 평가되므로 변수에 할당할 수 있다.

[예제 5-12]

// 표현식이 아닌 문은 값처럼 사용할 수 없다.
var foo = var x; // SyntaxError: Unexpected token var

위 예제의 변수 선언문은 표현식이 아닌 문
➡️ 값으로 평가될 수 없다.

따라서 변수 선언문은 갑처럼 사용할 수 없다.

[예제 5-13]

// 변수 선언문은 표현식이 아닌 문이다.
var x;

// 할당문은 그 자체가 표현식이지만 완전한 문이기도 하다. 즉, 할당문은 표현식인 문이다.
x = 100;

위 예제의 할당문 x = 100은 그 자체가 표현식이다.
즉, 할당문은 표현식인 문이기 때문에 값으로 사용할 수 있다.

[예제 5-14]

// 표현식인 문은 값처럼 사용할 수 있다
var foo = x = 100;

console.log(foo); // 100

할당문을 값처럼 변수에 할당
표현식인 문인 할당문은 할당한 값으로 평가됨

즉, x = 100은 x 변수에 할당한 값 100으로 평가된다.
따라서 foo에는 100이 할당됨.