자바스크립트 정리

2. 자료형이란?

알럽유 2023. 7. 11. 15:14
728x90
반응형

자바스크립트의 데이터 타입

▶자바스크립트는 크게 2가지 타입을 제공합니다

        ▶원시타입

        ▶객체 타입

자바 스크립트의 데이터타입 - 원시타입

▶자바스크립트는 7가지의 원시 타입을 제공한다.

        ▶String, Number, Biglnt, Undefined, Null, Boolean, Symbol

▶원시 타입의 특징

        ▶값은 변경 불가능한 값이다. immutable value

        ▶"값"으로써 전달된다. (참고 형태로 전달되는 것이 아닌)

▶자바스크립트에서 원시 래퍼 객체가 따로 존재한다. 원시 데이터를 사용할 경우,

    해당 레퍼 객체들을 상송받아 사용할 수 있다.

        ▶원시 래퍼 객체와 원시 타입을 헷갈리지 말자

자바스크립트의 데이터 타입 - 객체타입

▶원시 타입의 값을 제외한 자바스크립트에서의 모든 것은 객체이다.

        ▶객체는 여러 형태로 분류할 수 있다.

        ▶일반 객체와 함수, 날짜, 인덱스 컬렉션, 키 컬렉션, ....

▶객체타입의 특징

        ▶객체는 참조방식으로 전달된다. Pass by reference

             ▶Fyi; deep copy, shallow copy

        ▶객체는 속성들을 변경할 수 있는 mutable한 값이다.

Number Type

▶숫자에는 정수 , 실수가 존재

        ▶다른언어: int, long, float, double등..

        ▶자바스크립트에서 하나의 숫자타입만 존재 = Number

▶자바스크립트는 모든 숫자를 실수를 처리

        ▶정수타입 없음

▶숫자형에는 우리가 아는 숫자 이외에 Infinity, NaN이라는 값도 존재한다.

        ▶Infinity : 무한대를 나타내는 숫자

        ▶NaN : 숫자가 아님을 나타낸다.

BigInt Type

▶임의 정밀도로 정수를 나타낼 수 있는 JavaScript숫자 원시 값

▶BigInt를 Number의 최대닶을 넘는 정수도 안전하게 저장하고 연산할 수 있다.

▶다른 타입과 혼합하여 연산할 수 없다.

String Type

▶텍스트 데이터를 나타낼 때 사용

▶UTF-16 코드 딘위의 시퀀스로 표현

        ▶16bit 정수값의 요소로 구성된 집합

        ▶각 요소가 string의 한 자리

        ▶0번째 index부터 시작

▶원시값은 불변합니다. == 문자값은 불변합니다.

String Type - 표기법

▶따옴표나 쌍따옴표, 백팃으로 감싸서 문자열임을 표현

▶템플릿 리터럴 표기법(` `)

    ▶백팃의 표현은 ES6 이후부터 사용가능

    ▶문자열 처리 기능 제공(줄바꿈 허용, 표현식 삽입 가능)

    ▶String interpolation

          ▶`My name is ${표현식}`

Boolean Type

▶논리적 데이터 유형

▶참 혹은 거짓의 값만 가질 수 있다.

▶e.g

          ▶상태값)input tag의 checkbox 타입의 checked 상태

          ▶flag 값)특정 UI의 노출여부를 보여주는 변수의 상태 is Show

Undefined Type

▶변수를 선언한 후 값을 할당하지 않은 변수에 할당이 되는 값

         ▶변수 초기화단계에서의 Undefined는 개발자가 의도해서 넣은 값이 ㅇ나ㅣ다

▶개발자가 의도해서 넣을 수도 있다.

Null Type

▶값이 없다는 것을 의도적으로 표현할 때 null을 사용한다.

▶이전에 참조되어있던 값을 의도적으로 더이상 참조하지 않겠다는 뜻으로도 사용한다.

▶null 타입체크는 일치연산자 (==)사용하기

          ▶null의 type은 'object'라고 나오는데, 이는 자바스크립트 스펙 내의 버그

          ▶null의 타입체크는 일치연산자를 활용하자.

Symbol Type

▶ES6에 추가된 타임

▶중복되지 않는 유니크한 값이다.

          ▶객체의 key로 사용될 수 있다.

          ▶클래스나 객체형식의 내부에서만 접근할 수 있도록 전용 객체 속성의 키로 사용

▶Symbol함수를 호출하여 생성

객체타입

▶객체타입, Object type, Reference type

▶객체 타입: 다양한 타입의 값을 하나의 단위로 구성한 복합적인 자료구조

           ▶객체: 데이터(속성), 데이터에 관련한 동작을(method)포함하는 개념적 존재

▶원시 타입의 값을 제외한 자바스크립트에서의 모든 것은 객체

객체타입 - mutable

▶변경 가능한 값(mutable): 객체의 속성을 변경, 추가, 삭제 가능

          ▶원시값: immutable한 값

▶힙 메모리에 저장

          ▶동적으로 변화가능하므로, 메모리 공간 확보 및 저장

▶Pass - by - reference

          ▶참조 타입이므로, 참조값으로 처리

여러 형태의 객체 타입

▶일반 객체와 함수

▶날짜

▶인덱스 컬렉션

▶키 컬렉션

동적 타입 언어?

▶자바스크립트는 동적 타입 언어

▶의도적으로 타입을 변환할 수도 있지만, 의도와 상관없이 변경되기도 함

           ▶명시적 타입 변환

           ▶암묵적 타입 변환

명시적 타입 변환

▶원시 래퍼 객체를 활용하여 개발자가 의도적으로 타입을 변경할 수 있다.

           ▶값.toString() 문자열 타입으로 변환

           ▶Number (값) 숫자타입으로 변환

           ▶Boolean(값) 불리언 타입으로 변환

암묵적 타입 변환

▶개발자가 의도하지 않았지만, 타입이 변동될 때가 있다.

           ▶값 + " " 문자열 타입으로 변환

           ▶값 * 1 숫자 타입으로 변환

           ▶!!값 불리언 타입으로 변환

값이 전달될때, 참조되어있는 변수 값 타입이 개발자의 의도와 다르게 암묵적 타입변환으로 변경될 가능성이 있다.

           ▶타입추론이 어려워져, 불필요한 디버깅 시간 발생

▶이를 해결하기 위하여

           ▶전달되는 시점마다 typeof나 일치연산자를 사용하여 타입guard구현

           ▶자바스크립트 superSet타입스크립트 사용