> For the complete documentation index, see [llms.txt](https://wlgus3.gitbook.io/jhs-modern-js-deep-dive-note/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://wlgus3.gitbook.io/jhs-modern-js-deep-dive-note/05.md).

# 05 표현식과 문

## 5.1 값&#x20;

값은 식(표현식expression)이 평가evaluate되어 생성된 결과를 말한다. 평가란 식이 해석되어 값을 생성하는 것을 말한다.

값은 다양한 방식으로 생서할 수 있다. 식으로 생성할 수도 있지만 가장 기본적인 방법은 **리터럴**을 사용하는 것이다.

## 5.2 리터럴

**\[리터럴]**&#xC740; 사람이 이해할 수 있는 **문자 또는 약속된 기호를 사용**해 **값을 생성하는 표기법**을 말한다.

리터럴은 사람이 이해할 수 있는 **문자 또는 미리 약속된 기호 (' '," ", . , \[] , {} , // 등)로 표기한 코드**다. 자바스크립트 엔진은 코드가 실행되는 시점인 런타임에 리터럴을 평가해 값을 생성한다. 즉 리터럴은 값을 생성하기 위해 미리 약속한 표기법이라고 할 수 있다.

<figure><img src="https://45367248-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FdJ0EyH216Xh9SDawFrKd%2Fuploads%2F0uqfBVeaCORQuxeqQMct%2Fimage.png?alt=media&amp;token=081cb258-ecbd-4f59-aef9-dcdf9063e862" alt=""><figcaption></figcaption></figure>

## 5.3 표현식 : 값으로 평가될 수 있는 문

**\[표현식]**&#x65;xpression은 **값으로 평가될 수 있는 문**statement이다. 즉 표현식이 평가되면 새로운 값을 생성하거나 기존의 값을 참조한다.

```javascript
var score = 100;
var score = 50 + 50;
```

위 코드에서 100은 리터럴이자 표현식이다. 자바스크립트 엔진에 의해서 평가되어 값을 생성하기 때문이다. 마찬가지로 50+50또한 리터럴과 연산자로 이뤄진 표현식이다.

```javascript
score; // -> 100
```

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

즉, 값으로 평가될 수 있는 모든 문은 표현식이다.

**표현식**과 **표현식으로 평가되어 생성된 값**은 **동치**equivalent이다. 따라서 값이 들어갈 수 있는 자리에는 표현식도 위치할 수 있다. 따라서 표현식은 다른 표현식의 일부가 될 수 있다.

## 5.4 문 : 프로그램을 구성하는 기본 단위이자 최소 실행 단위

**\[문]statement**은 프로그램을 구성하는 **기본 단위이자 최소 실행 단위**이다.&#x20;

**문은 여러 \[토큰]token으로 구성**되는데, **토큰은 문법적인 의미를 가지며, 문법적으로 더 이상 나눌 수 없는 코드의 기본 요소**를 의미한다. 예를 들어 키워드, 식별자, 연산자, 리터럴, 세미콜론, 마침표 등은 문법적인 의미를 가지며 문법적으로 더 이상 나눌 수 없는 기본 요소이므로 토큰이다. 문은 컴퓨터에 내리는 명령문이라고도 부른다.

&#x20;문은 **선언문, 할당문, 조건문, 반복문** 등으로 나눌 수 있다.

## 5.5 세미콜론과 세미콜론 자동 삽입 기능

**세미콜론(;)은 문의 종료**를 나타낸다. 따라서 문을 끝낼 때에는 세미콜론을 붙여야 하며, 여러 문을 중괄호로 묶은 코드블록( {...}) 뒤에는 세미콜론을 붙이지 않는다. JS엔진의 **세미콜론 자동 삽입 기능 (ASI automatic semicolon insertion)**&#xB355;분에 세미콜론은 생략 가능하다.

## 5.6 표현식인 문과 표현식이 아닌 문

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

'표현식인 문'과 '표현식이 아닌 문'을 구별하는 가장 간단명료한 방법은 변수에 할당해보는 것이다. <mark style="color:purple;">**표현식인 문**</mark><mark style="color:purple;">은 값으로 평가되므로</mark> <mark style="color:purple;"></mark><mark style="color:purple;">**변수에 할당할 수 있다**</mark><mark style="color:purple;">.</mark> <mark style="color:purple;"></mark><mark style="color:purple;">**표현식이 아닌 문**</mark><mark style="color:purple;">은 값으로 평가할 수 없기에</mark> <mark style="color:purple;"></mark><mark style="color:purple;">**변수에 할당시 에러가 발생**</mark><mark style="color:purple;">한다.</mark>

{% hint style="info" %}
\+ 개발자 도구에서 표현식이 아닌 문을 실행하면 언제나 undefined를 출력한다. 이를 **완료 값**이라고 한다. 이 값은 표현식의 평가 결과가 아니므로 참조하거나 변수에 할당할 수 없다. 개발자 도구에서 표현식인 문을 실행하면 평가된 값을 반환한다.
{% endhint %}
