본문 바로가기

카테고리 없음

자바스크립트 expression(식)과 statement(문)

자바스크립트의 코드는 식과 문으로 나누어 볼 수 있습니다. 두 용어의 차이점에 대해서 알아보겠습니다.

 

 

expression

식(expression)이란 값을 만들어내는 코드 단위입니다. 무엇이든 하나의 값(value)를 반환하는 것은 식입니다. 

 

아래 코드는 모두 식에 해당합니다. 자바스크립트는 다음과 같은 코드들을 해석해서 값을 돌려줍니다.

 

10; // 숫자 리터럴
"Hi"; // 문자 리터럴
true; // 불린 리터럴
1 + 4; // 산술식
10 < 100; // 논리식
"Hello" + "World"; // 문자식 
this // 특정 object를 가리키는 키워드
functionCall(); // 어떤 값을 return하는 함수
abc = 77; // 할당식 

 

 

하나의 식(expression)을 여러개의 식(subexpression)으로 작성할 수도 있습니다.

 

// 아래 expression은 여러개의 subexpression으로 이루어졌습니다.
12 + square(7 + 5) + square(square(2));

// 다음과 같은 순서에 따라서 값을 만들어 냅니다.
// 12 + square(7 + 5) + square(square(2));
// 12 + square(12) + square(square(2));
// 12 + 144 + square(square(2));
// 12 + 144 + square(4);
// 12 + 144 + 16;
// 156 + 16;
// 172;

 

 

모든 코드가 값을 만들어 내는 것은 아닙니다. 이렇게 값을 만들지 못하는 코드를 문(statement)라 합니다. 문은 값을 반환하지 않기 때문에, 식이 필요한 곳에 문을 넣을 수 없습니다. 예를들어 다음과 같은 코트는 오류가 발생합니다.

 

// console.log 함수에 인자로 declaration statement를 전달한 경우
console.log(const x);

// if statement를 변수에 할당하려한 경우
let b = if (x > 10) {return 100; };

 

 

이렇듯 식과 문의 사용법에 맞지 않은 코드는 동작하지 않습니다.

 

 

statement

문(statement)은 무언가를 수행하는 코드 단위입니다. 하지만 값을 만들지는 않습니다. 때문에 함수의 인자나 피연산자 등과 같이 값(expression)이 들어가야하는 곳에 사용할 수 없습니다. 다음은 문(statement)의 예입니다.

 

1. 분기문(if, switch)

2. 반복문(for, while)

3. 변수 선언

4. 함수 선언

 

 

함수 선언문(Function Declaration)과 함수 표현식(Function Expression)

함수 선언은 함수를 값으로 갖는 변수를 생성하는 문(statement)입니다. 함수 선언문은 코드의 위치에 상관없이 호이스팅되어 스코프의 최상단으로 끌어 올려진 것처럼 동작합니다. 따라서, 함수 선언문이 정의되기 전에도 함수를 호출할 수 있습니다.

 

function funcDeclaration() {
  console.log( "함수 선언" );
}

 

 

함수 표현식은 함수를 생성하고 변수에 값을 할당하는 것과 같습니다. 함수 표현식으로 정의된 함수는 해당 코드가 작성된 위치에서 함수가 생성됩니다. 이렇게 함수가 생성된 이후부터만 사용이 가능합니다.

const funcExpression = function () {
  console.log( "함수 표현식" );
}

 

 

* 자바스크립트에서 함수는 값으로 취급됩니다.

  값이기 때문에 아래와 같이 코드를 출력할 수도 있습니다.