[기초 이론] Data Type: Primitive

원시 값

JavaScript에서 원시 값(Primitive, 또는 원시 자료형)은 단일 데이터만 담을 수 있는 데이터이다. 복합 데이터인 객체나 객체의 속성 함수인 메서드 그리고 함수는 포함하지 않는다. 원시 값은 변하지 않으며 변형되지 않는다. 원시 값 자체와 원시 값을 할당할 변수를 혼동하지 않아야 한다. 변수는 새로운 값을 다시 할당할 수 있지만, 이미 생성한 원시 값은 객체, 배열, 함수와 달리 변형할 수 없다.

// !!문자열 메서드는 문자열을 변형하지 않음
let bar = 'hangul'
console.log(bar); // > hangul

bar.toUpperCase(); // > 소문자를 대문자로 변환해주는 '문자열 메서드'
console.log(bar) // > 여전히 hangul

// !!할당은 원시 값에 새로운 값을 부여 (변형이 아님) 
// JavasScript가 느슨한 동적언어이기 때문

bar = bar.toUpperCase(); 
console.log(bar) // > HANGUL

이렇듯 최초 생성된 원시 값은 변형이 불가능하며 해당 변수에 재할당만 가능하다. 원시 값의 불변성에 대해 정확한 이해도가 있어야 한다.

원시 값의 종류

Number

Number 타입은 말 그대로 숫자 형식이다. 10진수 형태의 정수(Integer), 음수(Negative), 실수(Double) 모두 사용 가능하며 컴퓨터가 읽을 수 있는 2진수(Binary), 8진수(Octal), 16진수(Hex) 또한 Number 타입이다. Number 타입은 부동소수점 숫자 외에도 Infinity(=+Infinity), -Infinity, NaN 세 개의 상징적인 값을 가진다. 또한 산술 연산자를 이용해 사칙연산을 시행할 수도 있다.

console.log(1 + 1); // > 더하기: 2
console.log(1 - 1); // > 빼기: 0
console.log(1 * 1); // > 곱하기: 1
console.log(1 / 1); // > 나누기: 1
console.log(1 ** 1); // > 거듭제곱: 1
console.log(1 % 1); // > 나머지: 0

Infinity

Infinitiy 는 무한대를 나타내는 숫자값이다. 숫자를 0으로 나누면 JavaScript에서 Infinity를 반환한다. 

console.log(1 / 0.1); // > 10
console.log(1 / 0.01); // > 100
console.log(1 / 0.001); // > 1000

// 이렇듯 나누는 숫자가 0에 수렴할 수록 값이 커지게 되는데 점점 숫자가 커지니 컴퓨터는 '무한'으로 반환한다.

console.log(1 / 0); // > Infinity
console.log(1 / -0); // > -Infinity

NaN

NaN 은 Not a Number, 즉 숫자가 아니라는 뜻이다. 숫자가 아닌 것을 연산하면 JavaScript 에서 NaN 을 반환한다.

console.log(100 * 'love'); // > NaN

isFinite() / isNaN()

Infinity 와 NaN 을 판단해서 true / false 로 반환하는 함수다.

 

BigInt

Number 원시 값이 안정적으로 나타낼 수 있는 최대치인 2^53 - 1보다 큰 정수를 표현할 수 있는 내장 객체이다. Number 타입 처럼 연산자를 이용할 수 있지만 Number 타입과 혼합해 연산할 수 없으며, 만약 실행할 경우 TypeError 가 발생한다. 

console.log(1000000000000000000000); // > le+21
console.log(1000000000000000000000n); // > 1000000000000000000000n

String

String 타입은 JavaScript 에서 문자 데이터를 나타낼 때 사용하는 문자 형식이다. String 타입을 나타내는 기호는 따옴표인 "", '', `` 가 있다. 따옴표로 문자 데이터를 감싸면 JavaScript 가 String 타입으로 인식하며 반드시 처음과 끝은 같은 따옴표 기호를 써야 한다. 그리고 String 타입 안에 여러개의 따옴표를 쓰기 위해선 각각 다른 기호를 사용하여야 한다.

console.log(1); // > Number
console.log('1'); // > String

// console.log('!! Wrong !!`); 

console.log("My name is 'Sumin'.");
console.log('she said "CLEAN UP THE ROOM!!"');

연결 연산자

String 타입은 Number 타입과 같이 연결 연산자 + 를 사용해서 문자열을 만들 수 있다. 다만 이외의 연산자는 NaN 에러가 뜨므로 시도해보지 말자. 

console.log(1 + 1); // > 2
console.log(1 + '1'); // > 11

이스케이프 표현

백슬래시 (\) 뒤에 한 문자나 숫자 조합이 오는 문자 조합을 이스케이프 표현이라고 한다. 일반적인 출력 문자 외에 특수 문자는 해당 표현을 사용하도록 한다.

console.log('This Is \nToo much long \nString'); 
// This Is <br> Too much long <br> String

// \t = 탭
// \\ = \
// \' = '
// \" = "

템플릿 리터럴

템플릿 리터럴(Template Literal) 이란 내장된 표현식을 허용하는 문자열 리터럴이다. 여러 줄로 이뤄진 문자열과 문자 보간기능을 사용할 수 있다. 템플릿 리터럴은 "", '' 대신 백틱이라 불리는 `` 을 사용한다.

`\`` === "`" // > true

또 $와 중괄호를 이용해 변수와 표현식을 넣을 수 있다. ( $ {expression} ) 

const username = 'sumin';
const age = 99;

console.log('Hi, ' + username + '. Your age is... ' + age + '!!'); // ==>
console.log(`Hi, ${username}. Your age is... ${age}!!`);

Boolean

원시 Boolean 은 참(true) 혹은 거짓(false) 값 만을 가질 수 있다. JavaScript에서 불리언 조건은 어떤 코드 부문이 실행되어야 할 지 (예를 들어 if 절) 또는 어떤 코드 부문을 반복해야 할 지 (예를 들어 for 문) 결정하는 데 쓰인다.

const isLovely = true;
const isDisgusting = false;

Truthy 와 Falsy

Truthy 와 Falsy 는 JavaScript의 문법이 아닌 특성 같은 것이다. Truthy 는 true 같은 것, Falsy 는 false 같은 것으로 실제로 참과 거짓이 아니나 JavaScript 는 true와 false로 인식하는 것들이다.

• Truthy: true, 1, -1, 1n, "text" 
• Falsy: false, 0, -0, 0n, "", null, undefined 그리고 NaN 

null

null 은 어떤 값이 의도적으로 비어있음을 표현하는 원시 값이다.

undifined

undifined 는 어떤 값이 들어 있는 지, 없는 지 모르는 상태를 표현하는 원시 값이다.

Symbol

Symbol 은 Symbol() 함수로 생성된다. Symbol() 함수는 호출될 때마다 변경 불가능한 원시 값의 Symbol 을 생성한다. Symbol 은 추후 더 깊게 알아보도록 하겠다.

 

결론

원시 값이 영어나 한글이나 표현이 애매해서 대충 어떤 내용인 지 몰랐는데 그냥 '태초에 부여된 불변성의 값' 이라고 이해하는 편이 쉬울 것 같다. 재할당이 아니면 값을 수정할 수 없다는 건 조금 충격적이었다. 예를 들어 a라는 변수에 5라는 값을 할당했을 때, 특정 조건을 이수하면 1씩 더해지는 건 JavaScript로 어떻게 표현할 수 있을까?

 

또 템플릿 리터럴은 자주 쓰일까? 현재 배우는 내용에는 잘 쓰이진 않는다. 그래도 알아두면 좋겠지.