본문 바로가기

스터디/[모던 자바스크립트 deep dive] JS

#5. 표현식과 문

1. 값


  • : 평가되어 생성된 결과를 말한다.
    • 평가 : 식을 해석해서 값을 생성하거나 참조하는 것을 의미
  • 모든 값은 데이터 타입을 가지며 메모리에 2진수, 즉 비트의 나열로 저장된다.
var sum = 10 + 20;
  • sum 변수에 할당 되는 것은 10+20이 아니라 평가된 결과인 숫자 30이므로 10+20은 할당 이전에 평가되어 값을 생성해야 한다. 

2. 리터럴


  • 리터럴 : 사람이 이해할 수 있는 문자 또는 약속된 기호를 사용해 값을 생성하는 표기법을 말한다.
    • 리터럴은 평가되어 값을 생성한다.
    • 리터럴은 사람이 이해할 수 있는 문자 (아라비아 숫자, 알파벳, 한글 등) 또는 미리 약속된 기호 (' ', " ", [ ], { }, // 등)로 표기한 코드다.

  • 자바스크립트 엔진은 런타임에 리터럴을 평가해 값을 생성한다. 


3. 표현식


  • 표현식 : 값으로 평가될 수 있는 문 ( statement ) 이다. 즉, 표현식이 평가되면 새로운 값을 생성하거나 기존 값을 참조한다.
var score = 100;
//100은 리터럴이다. 자바스크립트에 의해 평가되어 값 100을 생성하므로 리터럴은 그 자체로 표현식

var score = 50 + 50;
//숫자 값 100을 생성하므로 표현식

score;
//변수 식별자를 참조하므로 변수 값으로 평가 된다. 따라서 표현식
// 리터럴 표현식
10
"hello"

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

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

// 함수 / 메서드 호출 표현식 (선언이 이미 존재한다고 가정)
square()
person.getName()
  • 표현식과 표현식이 평가된 값은 동등한 관계 즉, 동치다. 따라서 표현식은 값처럼 사용할 수 있고 문법적으로 값이 위치할 수 있는 자리에는 표현식도 위치할 수 있다.

4. 문


  • : 프로그램을 구성하는 기본 단위이자 최소 실행 단위이다. 
    • 문의 집합으로 이뤄진 것이 프로그램이며, 문을 작성하고 순서에 맞게 나열하는 것이 프로그래밍이다.
  • 토큰 : 문법적인 의미를 가지며, 문법적으로 더 이상 나눌 수 없는 코드의 기본 요소를 의미한다. 
    • ex ) 키워드, 식별자, 연산자, 리터럴, 세미콜론(,)이나 마침표(.) 등의 특수 기호

// 변수 선언문
var x;

// 할당문
x=5;

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

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

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

5. 세미콜론과 세미콜론 자동 삽입 기능


  • 세미콜론 : 문의 종료를 나타낸다.
    • 자바스크립트 엔진은 세미콜론으로 문이 종료한 위치를 파악하고 순차적으로 하나씩 문을 실행한다.
    • 중괄호로 묶은 코드 블록은 자체 종결성을 갖기 때문에 뒤에 세미콜론을 붙이지 않는다.
  • 세미콜론 자동 삽입 기능 (ASI) : 자바스크립트 엔진이 소스코드를 해석할 때 문의 끝이라고 예측되는 지점에 세미콜론을 자동으로 붙여준다.
    • 이 기능이 암묵적으로 수행되기 때문에 세미콜론을 붙이는 것은 옵션이다. 즉, 생략 가능하다. 
    • 하지만 개발자의 예측과 ASI의 동작 결과가 다를 때도 있으므로 붙이는 것을 권장한다.

6. 표현식인 문과 표현식이 아닌 문


  • 표현식인 문 : 값으로 평가될 수 있는 문
    •  ex ) 할당문은 값으로 평가될 수 있으므로 표현식인 문이다.
  • 표현식이 아닌 문 : 값으로 평가될 수 없는 문
    • ex ) 변수 선언문은 값으로 평가될 수 없으므로 표현식이 아닌 문이다.

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

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

// 표현식인 문은 값처럼 사용할 수 있다.
var foo = x = 100; 
console.log(foo); // 100;
 
// 할당문은 그 자체가 표현식이자 완전한 문이다.
x=3;
  • 완료 값 : 크롬 개발자 도구에서 표현식이 아닌 문을 실행하면 언제나 undefined을 출력하는데 이를 완료 값이라고 한다.
    • 완료 값은 표현식의 평가 결과가 아니므로 다른 값과 같이 변수에 할당할 수도 없고 참조할 수도 없다.


'스터디 > [모던 자바스크립트 deep dive] JS' 카테고리의 다른 글

#9. 타입 변환과 단축 평가  (0) 2024.03.30
#8. 제어문  (1) 2024.03.23
#7. 연산자  (1) 2024.03.23
#6. 데이터 타입  (1) 2024.03.16
#4. 변수  (0) 2024.03.16