[JavaScript] 모던 JS Deep Dive 6장

ubin·2023년 10월 7일

JavaScript

목록 보기
8/21
post-thumbnail

6.0 데이터 타입 data type

값의 종류를 의미

  • JS의 모든 값은 데이터 타입을 가지고, 두가지 타입으로 구분됨
  • 원시 타입 (primitive type) : 실제 데이터 값을 저장하는 타입, 변경 불가능한 값 immutable value
  • 객체 타입 (object/reference type) : 메모리 값을 통해 객체를 참조하는 타입
  • 데이터 타입마다 생성한 목적과 용도가 다르며, 해석하는 방식도 다름

6.1 숫자 타입

  • 하나의 숫자 타입만 존재함
  • 메모리에 배정밀도 64비트 부동소수점 형식의 2진수로 저장됨
  • 참조하면 모두 10진수로 해석됨
  • 숫자 타입은 정수 실수 모두 실수로 처리함 = 정수끼리 나눠도 실수가 나올 수 있음
  • 세 가지 특별한 값 표현
    • Infinity : 양의 무한대
    • -Infinity : 음의 무한대
    • NaN(not-a-number) : 산술 연산 불가
  • 대소문자 구별(case-sensitive)하므로 NaN ≠ nan, NAN, Nan .. 식별자로 해석됨

6.2 문자열 타입

텍스트 데이터를 나타내는 데 사용함

  • 거의 모든 문자를 표현할 수 있음
  • 작은따옴표(’’), 큰따옴표(””), 백틱(``)으로 텍스트를 감싸야 함
  • 따옴표로 감싸지 않은 문자열은 식별자로 인식됨
  • 따옴표로 감싸지 않으면 공백 문자도 포함 할 수 없음
  • 원시 타입이며 변경 불가능한 값으로 문자열이 생성되면 변경할 수 없음

6.3 템플릿 리터럴

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

멀티라인 문자열

  • 이스케이프 시퀀스 : 예약어와 같은 프로그래핑 언어 특성상 표현할 수 없는 기능 또는 문자를 표현해줌
    • \0 : NULL
    • \b : 백스페이스
    • \n : 개행: 다음 행으로 이동
    • \r : 개행: 커서를 처음으로 이동
    • \t : 탭 (수평)
    • \v : 탭 (수직)
    • \’ : 작은따옴표
    • \” : 큰따옴표
    • \ : 백슬래시
  • 템플릿 리터럴 내에는 이스케이프 시퀀스를 사용하지 않고도 줄바꿈이 허용되고 공백도 그대로 적용됨

표현식 삽입

  • 문자열은 피연산자 중 하나 이상이 문자열일 때, 문자열 연산자+를 사용해 연결할 수 있음
  • 템플릿 리터럴 내에서는 ${표현식} 표현식 삽입을 통해 간단히 문자열 삽입 가능
  • ${표현식} 속 표현식의 평가 결과가 문자열이 아니더라도 문자열로 취급
  • 템플릿 리터럴 내에서만 사용가능

6.4 boolean 타입

  • 값은 true와 false만 존재

6.5 undefined 타입

변수에 값을 할당하여 변수의 실체를 명확히 하지 않은 것을 의미

  • 값은 undefined 하나만 존재
  • var 키워드로 선언한 변수는 암묵적으로 undefined로 초기화됨
  • undefined는 JS 엔진이 변수를 초기화할 때 사용하는 값
  • undefined 값을 개발자가 의도적으로 할당하는 것은 권장하지 않음
  • 변수에 값이 없다는 것을 명시할 땐 null을 할당
  • 변수는 ‘선언’ 함수는 ‘정의’

6.6 null 타입

변수에 값이 없다는 것을 의도적으로 명시할 때 사용

  • 값은 null이 유일
  • 대소문자 구별에 의해 null ≠ Null, Null, NULL
  • null 값 할당 : 변수가 이전에 참조하던 값을 더 이상 참조하지 않겠다는 의미
  • null 반환 : 함수가 유효한 값을 반환할 수 없는 경우
    • document.querySelector() 메서드로 조건에 부합하는 HTML 요소가 없는 경우 null 반환

6.7 symbol 타입

  • 외부에 노출되지 않으며 다른 값과 절대 중복되지 않는 유일무이한 값
  • 보통 이름이 충돌할 위험이 없는 객체의 유일한 프로퍼티 키를 만들기 위해 사용
  • Symbol 함수 호출로 생성함

6.8 객체 타입

자바스크립트를 이루고 있는 거의 모든 것이 객체

6.9 데이터 타입의 필요성

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

  • 값은 메모리에 저장하고 참조할 수 있어야 함
  • JS 엔진은 데이터 타입마다 정해진 크기의 메모리 공간을 확보함
  • 숫자 타입은 8바이트 단위로 저장됨

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

  • 메모리에 저장된 값은 데이터 타입에 따라 다르게 해석될 수 있음
  • 데이터 타입이 필요한 이유
    • 값을 저장할 때 확보해야 하는 메모리 공간의 크기를 결정하기 위해
    • 값을 참조할 때 한 번에 읽어 들여야 할 메모리 공간의 크기를 결정하기 위해
    • 메모리에서 읽어 들인 2진수를 어떻게 해석할지 결정하기 위해

6.10 동적 타이핑

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

  • 정적 타입 언어
    • 변수 선언시 변수에 할당할 수 있는 명시적 타입 선언(데이터 타입을 사전에 선언)해야 함
    • 변수 타입 변경 불가 및 타입에 맞는 값만 할당 가능
    • 컴파일 시점에 타입체크 수행, 다를시 에러 발생 및 실행 불가
    • 런타임 에러 줄어듬
    • C JAVA C++ 코틀린 ..등
  • 동적 타입 언어
    • 변수 선언시 타입을 선언하지 않음
    • 변수에 어떠한 데이터 타입의 값이라도 자유롭게 할당 가능
    • 복잡한 프로그램에서는 변화하는 변수 값을 추적하기 어려울 수 있음
    • 변수는 값의 변경에 의해 타입도 언제든지 변경될 수 있음
    • 값 확인 전에는 타입을 확신할 수 없음
    • 유연성은 높지만 신뢰성은 떨어짐
    • Javascript python PHP 루비 ..등

동적 타입 언어에서 변수 사용시 주의할 사항

  • 변수는 꼭 필요한 경우에만 제한적으로 사용 : 변수값은 재할당에 의해 언제든지 변경될 수 있으며 오류 발생 가능성 큼
  • 변수의 유효 범위는 최대한 좁게 만들어 변수의 부작용 억제
  • 전역 변수는 최대한 사용하지 않도록 함
  • 변수보다는 상수를 사용해 값의 변경을 억제
  • 변수의 이름은 변수의 목적이나 의미를 파악할 수있도록 네이밍

자바스크립트에서 변수 사용

  • var let const 키워드를 사용해 변수 선언
  • typeof 연산자로 데이터 타입을 조사할 수 있음
    • console.log(typeof x); // undefined number string .. 등
  • 값을 할당하는 시점에 변수의 타입이 동적으로 결정(타입 추론)됨
  • 재할당에 의해 변수의 자유롭게 타입은 동적으로 변할 수 있음
  • JS 엔진에 의해 안묵적으로 타입이 자동으로 변환되기도 한다
💡 가독성이 좋은 코드가 좋은 코드다
profile
프론트엔드 개발자가 되고싶은 코린이⌨️

0개의 댓글