JavaScript 변수선언 및 타입 (4) Data Type (3-4 ~ 3-6)

-원시값
3-1, Number 타입 (+NaN)  3-2, String 타입  3-3, Boolean 타입

3-4, Null 타입  3-5, Undefined 타입(+Undeclared) 3-6, BigInt 타입  3-7, Symbol 타입
-객체 (속성의 컬렉션)
3-8, Object

 

지난 JavaScript 변수선언 및 타입 (3)에서 Number (+NaN), String, Boolean 에 관한 내용을 다루어 보았다.

이번 (4)에서는 Null, Undefined (+Undeclared), Bight 을 다루어보자.

 

 

 

3-4, Null

null 타입은 null 이 유일하다.

null 이란건 비어있다. 값이 없다라는것을 의미한다.

프로그래밍 언어에서 null은 변수에 '공간 존재하지만 그 안에 할당된 값이 없습니다.'라고 명시해주기 위해 쓰인다.

JS는 대소문자를 구별(case-sensitive)하기 때문에 Null 이나 NULL 처럼 대문자가 있는 경우와는 다르다.

 

null을 사용하기 위해서는 변수에 null을 할당한다.

또는 함수가 호출되었으나 유효한 값을 반환할 수 없는 경우, 명시적으로 null을 반환하기도 한다.

document.querySelector() 가 null을 반환하는 경우중의 하나이다.

 

 

JS의 null 타입

null의 typeof 를 확인해 보면 object가 나오는것을 볼 수 있다.

이것은 명백한 JS의 초기설정 오류로, 처음 JS라는 언어가 탄생되는 단계에서 발생한 설계오류이지만 하휘호환성을 위해 수정하지 않고 있다.

그래서 null에 대한 타입으로 확인을 할때는 typeof 연산자가 아닌 일치연산자(=== , Strict equality)를 사용한다.

 

JS의 null 타입 확인

 

 

 

3-5, Undefined (+Undeclared)

undefined 타입의 값 또한 undefined 가 유일하다.

변수 선언 이후에 값을 할당하지 않으면 undefined의 값으로 초기화된다.

JS는 변수를 생성했을 때 쓰레기 값(Garbage value)을 두지 않고 undefined라는 값을 할당한다는 의미이다.

또한 존재하지 않는 객체 프로퍼티(object property)에 접근할 경우 undefined가 반환된다.

 

JS의 undefined 타입

 

그런데 여기에서 한가지 재미있는 부분이 있다.

바로 생성한적이 없는 변수를 사용하는 것이다. 이 부분에 대해서는 소스코드로 알아보자.

 

JS의 undeclared 타입??

크롬에서 개발자도구의 콘솔창을 보면 not defined와 함께 typeof _Undeclared라고 오류표기를 해주는 것을 확인할 수 있다.

미선언 변수에 해당하는 경우인데, 정확히는 undeclared이지만 JS는 해당 변수를 undefined로 간주하여 따로 오류처리를 하지 않도록 해준다.

 

앞에서 null 은 값이 없음을 의미한다고 말했다. 또한 undefined 도 값이 없는걸 의미하는걸 알수있다.

그래서 null 과 undefined 의 값을 비교해보고 확인해보는것도 꽤나 재미가 있다.

 

JS의 null과 undefind 비교

 

null 과 undefined 둘다 값이 없음을 의미하기 때문에, 동등 연산자(Equality operator)로 하는 단순 값의 비교에서는 true를 반환하는걸 볼수있지만, 자료형(data type)은 다르니 일치 연산자(Strict equality)로 비교해보면 false 값을 확인 할 수 있다.

 

 

 

3-6, BigInt

우리는 앞에서 5가지 Data type과 그에 대한 여러가지 연산 결과를 보고왔다.

Bigint는 ES2020에서 정의되면서 새로 추가된 Data type인데, 이 녀석이 아주 골때리면서 재미나다....

 

본 글쓴이는 앞서 숫자는 전부 number 타입이면서, 숫자리터럴과 Dynamic Typing 기능을 얘기하면서 JS는 연산처리를 할 때 자동으로 형변환을 하고 처리한다는 말을 했었다.

 

근데 BigInt 가 나오면서 앞에 얘기하는 것들이 모두 거짓말이 되었다.

BigInt 는완벽한 예외 상황으로 따로 알아두어야 하는 녀석이다....

BigInt 는 big + int 의 합성용어로 큰 정수(big integer)를 의미하고 있다.

BigInt 를 이해하기 위해서는 number 타입으로 돌아가 가장 큰 수 부터 다시 살펴볼 필요가 있다.

 

JS에서 number 타입으로 다룰수 있는 숫자의 최대 크기는 2의 53제곱에 1을 뺀 값이다.

 

JS의 가장 큰 number 9,007,199,254,740,991

 

이것 보다 큰 숫자를 사용하고 싶다면 어떻게 될까??

 

JS의 가장 큰 숫자 보다 더 큰 숫자

 

콘솔로 확인한 값을 보면 연산값이 안 맞는것을 확인 할 수 있다.

그래서 number 타입으로는 나타낼 수 없는 9,007,199,254,740,991 보다 큰 값을 정확하게 표기하고 계산 할 수 있도록 나온 데이터 타입이 BigInt이다.

 

BigInt은 정수 리터럴 뒤에 n을 붙이거나 (23n) 함수 BigInt() 를 호출하여 생성 할 수 있다.

 

JS의 BigInt 타입 숫자

 

number 타입 숫자와 n을 붙인 숫자 그리고 BigInt() 를 호출한 숫자를 확인해보면

n을 붙인 숫자는 입력한 그대로의 값을 확인 할 수 있고, BigInt는 조금 오차가 나는 것을 확인 할 수 있다.

그 이유는 BigInt()에 입력한 값이 BigInt를 적용하기 이전의 수로 이를 표현하고자 했기 때문에 오차가 발생하는 것이다.

 

이런 오차는 애교이다. 아래 연산식을 보자.

 

JS의 number 타입과 binint 산술타입 연산

 

참나, string에서는 그렇게나 복잡하게 연산을 지원해주더니, 이제 BigInt는 다른 타입과 섞어서 쓰지말라고 한다.

 

number타입을 BigInt타입과 연산할때는 반드시 Data type을 변환시켜 사용해야 한다.

원래 이것이 옳은 것이긴 하지만.... 흠..... 뭔가 억울함이 느껴지는건 본 글쓴이만 그런것일까.. 싶다.

 

JS의 number 타입과 binint 타입 산술연산, 자료형 변환

 

자 한발짝 더 나아가서 한번 더 굉장한걸 볼 수 있다.

 

JS의 number 타입과 binint 타입 관계연산

 

와! 관계연산에서는 따로 Data type 변환과정을 안해줘도 되는구나! 고맙다!....

 

더 나아가 자세한 연산 내용은 소스코딩부분에서 다뤄보도록하자.

 

마지막으로 한가지 말하고 가자면, BinInt는 int 형 타입을 따라간다. 그래서 그에 대한 산술연산의 결과도 정수형을 나타내고 있다. 

 

정수형을 따라가는 것은 다른 언어에서 정수형 타입(int)을 활용해본 개발자라면 바로 이해하고 넘어갈 수 있는 내용이다.

하지만 그렇지 못한 개발자는 그게 뭐? 뭔데? 어쩌라는거지? 라는 식으로 반응 할 수도 있다...

 

정수형의 값을 처리한다는 것은 소수점 이하의 유의미한 값을 계산하지 않는다는 의미이다.

이 내용을 간단하게 설명하면 Bigint로 7n / 2n 라는 연산을 할 때, 그 값이 3.5n 일 것 같지만 소수점 아래 값은 버려지고 3n이라는 값이 나온다. 이것이 정수형을 다루는 연산에서의 특징이다.

 

3.3n 이나 3.03n 같이 소수점이 포함된 숫자리터럴에 n을 사용하면 error가 나오기 때문에 BigInt 사용시에는 반드시 정수형리터럴에 n 을 붙여서 사용해야한다.

 

 

 

여기까지 타입 null, undefined(+undeclared), Bigint 에 대해서 간단하게 알아보았다.

Symbol  타입과 Object 타입은 다음에 또 알아보자.

 

 

 

 

개시일  ::  2022-05-14, 16:30, Sat.

 

 

Reference
1, 저자: 이웅모, 도서: 모던스크립트 Deep Dive, 출판사: 위키북스

2, BigInt 타입. https://velog.io/@sjpark960520/JS-NDIT-4-BigInt

 

 

 

 

 

 

...