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

[모던 자바스크립트 Deep Dive] 06. 데이터 타입

동띵 2023. 8. 1. 11:22

💡 자바스크립트는 7개의 데이터 타입으로 이루어져 있다. 이 타입들은 원시 타입과 객체 타입으로 분류할 수 있다

구분 데이터 타입 설명

구분 숫자 타입 숫자, 정수, 실수 구분 X
원시 타입 (primitive type) 문자열 타입 문자열
불리언 타입 논리적 참과 거짓
undefined 타입 var 키워드로 선언된 변수에 암묵적으로 할당되는 값
null 타입 값이 없다는 것을 의도적으로 명시할 때 사용되는 값
심벌 (symbol) 타입 ES6에서 추가된 7번째 타입
객체 타입 (object/reference type) 객체, 함수, 배열 등

숫자 타입


  • 숫자 타입의 값은 배정밀도 64비트 부동소수점 형식을 따름 ⇒ 모든 수를 실수로 처리하며, 정수만 표현하기 위한 데이터 타입 존재 X
  • 정수, 실수, 2진수, 8진수, 16진수 모두 메모리에 배정밀도 64비트 부동소수점 형식의 2진수로 저장되어서 이 값들을 참조하면 모두 10진수로 해석됨
  • 추가적으로 세 가지 특별한 값도 표현 가능
    • Infinity : 양의 무한대
    • -Infinity : 음의 무한대
    • NaN : 산술 연산 불가 (not-a-number)

문자열 타입


  • 0개 이상의 16비트 유니코드 문자의 집합
  • 작은따옴표 (’’), 큰따옴표 (””), 백틱 (``)으로 텍스트를 감싸 표기
  • 원시 타입으로, 변경 불가능한 값임 ⇒ 문자열이 생성되면 그 문자열 변경 X

템플릿 리터럴


  • ES6부터 도입된 새로운 문자열 표기법
  • 멀티라인 문자열, 표현식 삽입, 태그드 템플릿 등 편리한 문자열 처리 기능 제공
  • 런타임에 일반 문자열로 변환되어 처리
  • 백틱 (``) 사용

멀티라인 문자열

  • 일반 문자열 내에서는 줄바꿈 허용 X ⇒ 공백을 표현하려면 백슬래시(\)로 시작되는 이스케이프 시퀀스 사용
  • 템플릿 리터럴 내에서는 이스케이프 시퀀스 사용하지 않고도 줄바꿈 허용되며, 모든 공백도 있는 그대로 적용

표현식 삽입

  • 일반 문자열 내에서는 문자열 연산자 +를 사용해 연결
  • 템플릿 리터럴 내에세는 ${}으로 표현식을 감싸 문자열에 삽입 가능
    • ${} 로 감싸진 표현식이 문자열이 아니더라도 문자열로 타입이 강제 변환되어 삽입

불리언 타입


  • 논리적 참, 거짓을 나타내는 true와 false

undefined 타입


 

  • undefined 타입의 값은 undefined가 유일
  • 변수 선언 이후 값을 할당하지 않은 변수를 참조하면 undefined 반환
    • var은 선언과 동시에 undefined로 값을 초기화하여 값을 할당하지 않고 참조하게 되면 undefined를 출력
  • 개발자가 의도적으로 할당하기 위한 값이 아니라 자바스크립트 엔진이 변수를 초기화할 때 사용하는 값
    • 변수 참조 시 undefined가 반환된다면, 이 변수는 선언 후 값이 할당된 적이 없는 (초기화되지 않은) 변수이다.
  • 개발자가 의도적으로 변수에 값이 없다는 것을 명시하고 싶을 때는 null 할당

null 타입


  • null 타입 값은 null이 유일
  • 변수에 값이 없다는 것을 의도적으로 명시할 때 사용
  • 변수에 null 할당 ⇒ 변수가 이전에 참조하던 값을 더 이상 참조하지 않겠다는 의미
    • 이전에 할당되어 있던 값에 대한 참조를 명시적으로 제거 ⇒ 자바스크립트 엔진이 가비지 콜렉션 수행
  • 함수가 유효한 값을 반환할 수 없는 경우 명시적으로 null을 반환하기도 함

심벌 타입


  • ES6에서 추가된 7번째 타입
  • 변경 불가능한 원시 타입 ⇒ 다른 값과 중복되지 않는 유일무이한 값
  • 이름이 충돌할 위험이 없는 객체의 유일한 프로퍼티 키를 만들기 위해 사용
  • 심벌 이외의 원시 값은 리터럴을 통해 생성되지만, 심벌은 Symbol 함수를 호출해 생성
    • 이때 생성된 심벌 값은 외부에 노출되지 않으며, 다른 변수와 중복되지 않는 유일무이한 값임

객체 타입


  • 위 6가지 원시타입 이외의 값은 모두 객체 타입

데이터 타입의 필요성


데이터 타입에 의한 메모리 공간의 확보와 참조

  • 메모리에 값을 저장하려면, 확보해야 할 메모리 공간의 크기를 결정해야 함
    • 몇 바이트의 메모리 공간을 사용해야 낭비와 손실 없이 값을 저장할 수 있는지 알아야 됨
  • 자바스크립트 엔진은 데이터 타입에 따라 정해진 크기의 메모리 공간을 확보
  • 값 참조 시 메모리 셀의 개수 (바이트 수)를 알아야 함 ⇒ 참조하려는 값의 데이터 타입에 따라 바이트 수가 정해짐

데이터 타입에 의한 값의 해석

  • 모든 값은 데이터 타입을 가지며, 메모리에 2진수 (비트의 나열)로 저장됨
  • 메모리에 저장된 값은 데이터 타입에 의해 다르게 해석
    • 메모리에 저장된 값 0100 0001을 숫자로 해석하면 65지만, 문자열로 해석하면 ‘A’

⇒ 데이터 타입이 필요한 이유

  • 값을 참조할 때 확보해야 하는 메모리의 크기를 결정하기 위해
  • 값을 참조할 때 한 번에 읽어 들여야 할 메모리 공간의 크기를 결정하기 위해
  • 메모리에서 읽어 들인 2진수를 어떻게 해석할지 결정하기 위해

동적 타이핑


동적 타입 언어와 정적 타입 언어

  • 정적 타입 언어
    • 변수의 타입 변경 X, 선언한 타입에 맞는 값만 할당 가능
    • 컴파일 시점에 타입 체크를 통해 타입이 맞지 않으면 에러를 발생시키고 프로그램의 실행 자체를 막음 ⇒ 런타임에 발생하는 에러 줄임
    • 변수 선언 시점에 변수의 타입이 결정됨
  • 동적 타입 언어
    • 자바스크립트는 동적 타입 언어 ⇒ 변수 선언 시 타입 선언 X
    • 값 할당 시 타입이 동적으로 결정
    • 변수 선언이 아닌 할당에 의해 타입 결정 (타입 추론)되고, 재할당에 의해 변수 타입 동적으로 변함 ⇒ 동적 타이핑

동적 타입 언어와 변수

  • 동적 타입 언어의 변수는 값 확인 전까지 타입 확신 X ⇒ 유연성은 높지만 신뢰성 떨어짐

변수 사용시 주의 사항

  • 변수는 꼭 필요한 경우에 한해 제한적으로 사용
  • 변수의 유효 범위 (스코프)는 최대한 좁게 만들어 변수의 부작용 억제
  • 전역 변수는 최대한 사용 X
  • 변수보다는 상수를 사용해 값의 변경 억제
  • 변수 이름은 변수의 목적과 의미를 파악할 수 있도록 네이밍