05장 표현식과 문 - 모던 자바스크립트 Deep Dive

Minju Kim·2022년 5월 9일
1

Deep Dive

목록 보기
2/23
post-thumbnail
post-custom-banner

5.1 값

✅ 값이란?

값이란 표현식이 평가되어 생성된 결과를 말한다.
10+20;은 평가되어 숫자 값 30을 생성한다.

모든 값은 데이터 타입을 가지며, 메모리에 2진수(비트)의 나열로 저장된다.
변수는 하나의 값을 저장하기 위해 확보한 메모리 공간 자체 또는 그 메모리 공간을 식별하기 위해 붙인 이름이므로, 변수에 할당되는 것은 값이다.

5.2 리터럴

✅ 리터럴이란?

사람이 이해할 수 있는 문자 또는 약속된 기호를 사용해 값을 생성하는 표기법을 말한다. 자바스크립트 엔진은 런타임(코드가 실행되는 시점)에 리터럴을 평가해 값을 생성한다.

예를 들어, 배열 리터럴은 [ 1, 2, 3 ], undefined 리터럴은 undefined와 같은 형태로, 사람이 이해할 수 있는 약속된 기호로 되어 있는 것이 리터럴이다.

5.3 표현식

✅ 표현식이란?

값으로 평가될 수 있는 문(statement)이다. 표현식이 평가되면 새로운 값을 생성하거나 기존 값을 참조한다. 앞서 살펴본 리터럴은 값으로 평가되기 때문에, 리터럴도 표현식이다.

예제) var score = 100 이 예제에서 100은 리터럴이다. 리터럴 100은 자바스크립트 엔진에 의해 평가되어 값을 생성하기에, 리터럴은 그 자체로 표현식이라고 할 수 있다.

다시 말해, 값으로 평가될 수 있는 문은 모두 표현식인데, 그 예제는 아래와 같다.

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

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

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

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

5.4 문

✅ 문(statement)이란?

문은 프로그램을 구성하는 기본 단위이자 최소 실행 단위다. 문의 집합이 프로그램이며, 문을 작성하고 순서에 맞게 나열하는 것이 프로그래밍이다.

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

⛔️ var sum = 1 + 2는 여러 토큰으로 구성된 '문'의 예시이다.

✅ 문의 종류?

선언문, 할당문, 조건문, 반복문 등으로 구분할 수 있다.

// 변수 선언문
var x;

// 할당문
x = 5;

// 함수 선언문
function foo () {}

// 조건문
if (x > 1) {console.log(x)}

// 반복문
for (var i = 0; i <2; i++){console.log(i)}

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

✅ 언제 붙여야 하는가?

문의 종료를 의미하는 세미콜론(;)은 문을 끝낼 때 붙여야 한다. 단, 0개 이상의 문을 중괄호로 묶은 코드 블록({...}) 뒤에는 세미콜론을 붙이지 않는데, 문의 종료를 이미 의미해주는 }가 있으며, 따라서 자체 종결성(self closing)을 갖기 때문이다.

✅ 세미 콜론은 옵션이다?

자바스크립트 엔진이 소스코드를 해석할 때 문의 끝이라고 예측되는 지점에 세미콜론을 자동으로 붙여주는 세미콜란 자동 삽입 기능이 암묵적으로 수행된다.

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

✅ '값'으로 평가될 수 있는가?

표현식인 문은 값으로 평가될 수 있으며, 표현식이 아닌 문은 값으로 평가될 수 없다. 간단히 확인하려면 변수에 할당해 보면 된다.

⛔️ 예를 들어, 변수 선언문은 표현식이 아닌 문인데, 값처럼 사용할 수 없기 때문이다.

var foo = var x ; //...? 절대 이렇게 할 수 없다.
x = 100; // 할당문은 표현식인 문이다

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

💡 완료 값

크롬 개발자 도구에 표현식이 아닌 문을 실행하면 언제나 undefined를 출력하는데, 이를 완료 값이라고 한다. 완료 값은 표현식의 평가 결과가 아니기에, 다른 값과 같이 변수에 할당할 수 없고 참조할 수도 없다.

// 변수 선언문
var foo = 10; // undefined

// 조건문
if(true){} // undefined

var num = 10; // undefined

// 표현식인 문을 실행하면 평가된 값을 반환한다.
100 + num; // 110
num = 100; // 100
profile
⚓ A smooth sea never made a skillful mariner
post-custom-banner

0개의 댓글