JavaScript/모던 자바스크립트 Deep Dive

JavaScript 기초 정리_5)표현식과 문_모던 자바스크립트 Deep Dive

김쟈워니 2024. 6. 7. 13:27
값(value)
  • 식(표현식;expression)이 평가(evaluate)되어 생성된 결과
    • 평가란 식을 해석해서 값을 생성하거나 참조하는 것
  • 모든 값은 데이터 타입을 가지며, 메모리에 2진수, 즉 비트(bit)의 나열로 저장
  • 메모리에 저장된 값은 데이터 타입에 따라 다르게 해석될 수 있음
    • ex) 메모리에 저장된 값 0100 0001 을 숫자로 해석하면 65지만, 문자로 해석하면 'A'
  • 변수에 저장하는 것은 값
var sum=10+20;
  • 변수에 10+20이 평가되어 생성된 숫자 값 30이 할당

리터럴(literal)
  • 사람이 이해할 수 있는 문자 또는 약속된 기호를 사용해 값을 생성하는 표기법(notation)
  • 값을 생성하기 위해 미리 약속한 표기법
  • 리터럴을 사용하면 다양한 종류의 값을 생성할 수 있음

표현식(expression)
  • 값으로 평가될 수 있는 문(statement)
  • 표현식이 평가되면 새로운 값을 생성하거나 기존 값을 참조
  • 표현식은 리터럴,식별자(변수,함수 등의 이름), 연산자, 함수 호출 등의 조합으로 이뤄질수 있음
//리터럴 표현식
10
'hello'

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

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

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

문(statement)
  • 문(statement)은 프로그램을 구성하는 기본 단위이자 최소 실행 단위
  • 문의 집합으로 이뤄진 것이 바로 프로그램, 문을 작성하고 순서에 맞게 나열하는 것이 프로그래밍
  • 문은 여러 토큰으로 구성
    • 토큰(token)이란 문법적인 의미를 가지며, 문법적으로 더 이상 나눌 수 없는 코드의 기본요소를 의미
  • 문은 명령문이라고도 부름, 컴퓨터에 내리는 명령이기 떄문에
  • 선언문,할당문,조건문,반복문 등으로 구분할 수 도 있음
//변수 선언문
var x;

//할당문
x=5;

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

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

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

세미콜론과 세미콜론 자동 삽입 기능
  • 세미콜론(;) 은 문의 종료를 나타냄
    • 자바스크립트 엔진은 세미콜론으로 문이 종료한 위치를 파악하고 순차적으로 하나씩 문을 실행
    • 단, 코드 블록({....}) 뒤에는 세미클론을 붙이지 않음
      • 코드 블록은 문의 종료를 의미하는 자체 종결성(self-closing)을 가짐
  • 세미콜론은 생략가능
    • 자바스크립트 엔진이 세미콜론자동삽입 기능(ASI;Automatic Semicolon insertion) 을 가지고 있기 때문
      • 소스코드를 해석할 때 문의 끝이라는 예측 되는 지점에 세미클론을 자동으로 붙여줌
      • 그러나 세미클론 자동 삽입 기능의 동작과 개발자의 예측이 일치하지 않는 경우가 간혹이 있어 세미클론 사용을 권장함.
  • ASI 기능이 개발자의 예측과 다르게 일어나느 예시
funtion foo(){
	return
    	{}
// ASI의 동작 결과 => return; {};
// 개발자의 예측 => return {};
}

consol.log(foo());//undefined

var bar = function(){}
(function(){})();

//ASI의 동작 결과 => var bar = function(){}(function(){})();
//개발자의 예측 => var bar = function(){}; (function(){})();
// TypeError: (intermediate value) (...) is not a function

표현식인 문과 표현식이 아닌 문
  • 표현식인 문과 표현식이 아닌 문을 구별하는 가장 간단하고 명료한 방법은 변수에 할당해보는 것
    • 표현식인 문은 값으로 평가되므로 변수에 할당할 수 있음
    • 하지만 표현식이 아닌 문은 값으로 평가할 수 없으므로 변수에 할당하면 에러가 발생함
var foo =var x; //SyntaxError: Unexpected token var

//변수 선언문은 표현식이 아닌 문
var x;
//할당문은 그 자체가 표현식이지만 완전한 문이기도함.
x=100;