2 minute read

모던 자바스크립트 Deep Dive를 읽고 정리한 글입니다.

변수

자바스크립트 엔진이 코드를 계산(평가)하려면 기호(리터럴, 연산자)의 의미를 알고, 표현식의 의미도 해석(파싱)할 수 있어야 한다. 이러한 과정 수행하기 위해 데이터를 저장해야하고 그 과정에서 변수가 필요하다. 변수는 하나의 값을 저장하기 위해 확보한 메모리 공간 자체 또는 그 메모리 공간을 식별하기 위해 붙인 이름을 뜻한다.

  • 변수 이름을 식별자라고 하며, 식별자가 저장하고 있는 메모리 주소를 이용하여 해당 메모리에 저장된 값에 접근할 수 있다.
  • 변수 선언은 2단계로 진행된다.
    • 선언 단계: 변수 이름 등록해서 자바스크립트 엔진에 변수의 존재를 알림.
    • 초기화 단계: 값을 저장하기 위한 메모리 공간 확보 후 undefined 할당해서 초기화.

변수 선언 시점

변수 선언은 소스코드가 실행되는 시점(런타임)이 아닌 그 이전 단계에서 먼저 실행된다. 따라서 변수가 순서와 관계없이 어디에 위치하여도 참조할 수 있다. 변수 선언문이 코드의 선두로 끌어 올려진 것처럼 동작하는 이러한 특징을 변수 호이스팅(variable hoisting) 이라 한다.

console.log(score); // undefined
score = 80;
let score;
console.log(score); // 80
  • 선언과 초기화 단계를 동시에 적어도 undefined로 처음에 초기화되는 것은 변함 없다.
  • undefined로 할당된 메모리 주소를 지우고 초기화값을 할당하는 것이 아니라 새로운 메모리 공간에 값을 저장한다.
  • 더 이상 참조하지 않는 값은 가비지 콜렉터가 메모리에 자동 해제한다.

표현식과 문

  • 은 표현식이 평가되어 생성된 결과이다.
  • 리터럴은 사람이 이해할 수 있는 문자 또는 약속된 기호를 사용해 값을 생성하는 표기법이다. (코드 상의 3이라는 숫자는 숫자리터럴이며 엔진에선 다시 평가해 숫자 3을 생성해야한다.)
  • 표현식은 값으로 평가될 수 있는 문이다. 리터럴, 식별자, 연산자 등 모두 값으로 평가될 수 있으므로 표현식에 해당한다.
  • 은 프로그램을 구성하는 기본 단위이자 최소 실행 단위이다. (선언문, 할당문, 조건문, 반복문…)
    • 토큰은 문법적 의미를 가지며 더 이상 문법적으로 나눌 수 없는 기본 요소이다. 문은 토큰들로 이루어져있다.
    • 표현식인 문과 아닌 문의 차이점은 값으로 평가될 수 있는지이며 변수에 할당해보면 쉽게 알 수 있다.
    • 크롬, 터미널에서 표현식이 아닌 문을 실행하면 undefined를 출력한다. 해당 문을 실행 후 완료값을 반환하는데 표현식이 아니므로 평가 결과값이 없으므로 undefined가 출력된다.

데이터 타입

데이터 타입의 필요성

  • 값을 저장할 때 메모리 공간의 크기 결정하기 위해
  • 값을 참조할 때 한 번에 읽어 들여야할 메모리 공간의 크기를 결정하기 위해
  • 값을 해석할 때 어떤식으로 읽어들인 2진수를 해석할지 결정하기 위해

데이터 타입 종류

  • 숫자 타입
    • 정수, 실수 구분 없이 하나의 숫자 타입으로 구분한다.
    • 배정밀도 64비트 부동소수점 형식이다.
  • 문자열 타입
    • ’’, “”, `` 을 사용할 수 있고 백틱을 제외하고는 줄바꿈이 허용되지 않으며 이스케이프 시퀀스 사용해야한다.
  • 불리언 타입
  • undefined 타입
    • 선언된 변수가 초기화될 때 undefined로 된다. 자바스크립트 엔진이 초기화할 때 사용하는 값이므로 개발시 의도적으로 할당하는 것은 권장하지 않음.
  • null 타입
    • 변수에 값이 없다는 것을 의도적으로 명시할 때 undefined 대신 할당한다.
  • Symbol 타입

    • 변경 불가능하고 다른 값고 중복되지 않는 원시 타입의 값.
    const key1 = Symbol("mySymbol");
    const key2 = Symbol("mySymbol");
    console.log(key1 === key2); // false
    
    const key1 = Symbol.from("mySymbol");
    const key2 = Symbol.from("mySymbol");
    console.log(key1 === key2); // true
    
  • BigInt 타입
    • 숫자 타입이 다룰 수 있는 범위보다 큰 숫자를 다룰 수 있다.
    • n을 숫자 뒤에 붙이거나, BigInt() 함수로 생성 가능하다.
    • 소수점 이하는 생략되고, 숫타 타입과 혼용하여 연산할 수 없다.
      const bigInt = 2n ** BigInt(100);
      console.log(bigInt); // 1267650600228229401496703205376n
      
  • Object 타입
    • 위의 7가지 타입 이외의 모든 값은 객체 타입 (나중에 따로 자세히)

타입변환

  • 명시적 타입변환(explicit coercion, type casting): 개발자가 의도적으로 값의 타입을 변환하는 것
  • 암묵적 타입 변환(implicit coercion, type coercion): 자바스크립트 엔진에 의해 암묵적으로 타입 변환되는 것

Categories:

Updated: