JavaScript | 원시 타입에 대한 모든 것

데이터 타입

데이터 타입은 값의 종류를 말한다. javascript에서 원시 타입은 7개이며, 그 외에는 모두 객체 타입이다.

 

javascript는 객체 기반 언어이므로 거의 모든 것이 객체로 이루어져 있다. 이번 장에서는 원시 타입에 대해 다루고, 객체 타입은 추후 다루고자 한다.

 

js 엔진은 타입을 구별해서 값을 취급한다. 따라서 값이 같더라도 타입에 따라 해석하는 방식이 다르다.

ex) 0100 0001 - 숫자로 해석하면 65, 문자로 해석하면 ‘A’

 

원시 타입 1 - 숫자 타입(number)

C나 java의 경우, 정수와 실수를 구분해서 int, long, float 등 다양한 숫자 타입을 제공한다. 하지만 javascript에서 숫자는 실수 타입만 존재한다. 정수로 표기해도 사실은 실수다.

// 숫자 타입은 모두 실수로 처리된다.
console.log(1 === 1.0); // true

 

그리고 2진수, 8진수, 16진수를 표현하기 위한 데이터 타입이 없어서 값을 참조하면 모두 10진수로 해석된다.

var binary = ob01000001; // 2진수
var octal = 0o101; // 8진수
var hex = 0x41; // 16진수

// 표기법만 다를 뿐 모두 같은 값이다.
console.log(binary); // 65
console.log(octal); // 65
console.log(hex); // 65
console.log(binary === octal); // true
console.log(octal === hex); // true

 

그 외 숫자 타입 가능한 표현 방법은 다음과 같다.

• Infinity: 양의 무한대
• -Infinity: 음의 무한대
• NaN: 산술 연산 불가(not-a-number)

 

원시 타입 2 - bigInt 타입

ECMAScript 표준에 따르면 숫자는 -(2^53-1)과 2^53-1 사이의 값을 저장할 수 있다. 앞서 말한 숫자타입은 이 범위 외의 값을 다루기 어려웠다. ES2020에 새롭게 나온 bigInt 타입은 이 한계를 넘어서 더 큰 숫자를 저장할 수  있게 해준다.

const bigInt1 = 90071992547409955n; // 끝에 n을 붙이거나
const bigInt2 = BigInt("90071992547409955"); // BigInt 함수를 사용하면 된다

 

 

원시 타입 3 - 문자열 타입(string)

문자열 타입은 텍스트 데이터를 나타내는 데 사용한다. UTF-16의 집합으로 전 세계 대부분의 문자를 표현할 수 있다.

작은따옴표(’’), 큰따옴표(””), 백틱(``)으로 텍스트를 감싸서 표기하는데, 이는 키워드나 식별자 같은 토큰과 구변하기 위해서다.

 

문자열을 특징 중 하나는 문자열이 원시 타입이므로 변경 불가능하다는 것이다. 이는 한번 문자열이 생성되면 그 문자열은 변경할 수 없음을 의미한다.

 

템플릿 리터럴

ES6에 도입된 문자열 표기법으로 백틱(``)을 사용해 표현한다.
일반 문자열과 달리 줄바꿈이 허용되며 공백도 있는 그대로 적용된다.
또한 ${} 으로 문자열 내부에 표현식을 삽입 할 수 있다. 이때 표현식은 문자열로 타입이 강제로 변환되어 삽입된다.

var name = "Lee";

console.log("My name is" + name); // 일반 문자열인 경우
console.log(`My name is ${name}.`); // 템플릿 리터럴의 경우
// My name is Lee.

 

원시 타입 4 - 불리언 타입(boolean)

불리언 타입의 값은 논리적 참, 거짓을 나타내며, true, false이 있다.

조건문에서 마치 true와 false처럼 취급되는 truthy , falsy 값이 존재한다.

• truthy 값의 예: 1, {}, [] (객체와 배열은 내부에 값이 존재하는지 여부와 상관없이 truthy로 취급된다)
• falsy 값의 예: 0, NaN, "", null, undefined가 있다.

 

원시 타입 5 - undefined 타입

undefined 타입은 개발자가 의도적으로 할당하기 위한 값이 아닌, js 엔진이 변수를 초기화할 때 사용하는 값이다.
변수를 참조했을 때 undefined가 반환된다면 초기화되지 않은 변수라는 것을 간파할 수 있다.

 

원시 타입 6 - null 타입

null 타입은 변수에 값이 없다는 것을 의도적으로 명시할 때 사용한다.
변수에 null을 할당하는 것은, 변수가 이전에 참조하던 값을 더 이상 참조하지 않겠다고 알리는 것이다.

var foo = "Lee";
foo = null;

 

함수가 유효한 값을 반환할 수 없는 경우 명시적으로 null을 반환하기도 한다.

var element = document.querySelector(".myClass");

// HTML 문서에 해당 요소가 없다면 null을 반환한다.
console.log(element); // null

 

유의해야할 점은 typeof로 null을 확인하면 'object'가 반환된다.

 

원시 타입 7 - symbol 타입

심벌 타입은 ES6에서 새롭게 추가된 타입으로, 중복되지 않는 어떠한 고유한 값을 나타내기 위해 만들어졌다. Symbol 함수를 이용해서만 만들 수 있다.

// 같은 인수도 고유한 값으로 만들어 준다.
const key1 = Symbol("key");
const key2 = Symbol("key");
key1 === key2; // false

// 동일한 값으로 사용하기 위해서는 Symbol.for을 사용한다.
Symbol.for('hello') === Symbol.for('hello'); // true

 

참고

모던 자바스크립트 deep dive 책

모던 리액트 deep dive 책

https://developer.mozilla.org/ko/docs/Glossary/Primitive

https://ko.javascript.info/types