자바스크립트의 자료형

자바스크립트의 자료형에 대해 공부해보도록 하겠습니다.

자료형 => Type이라고도 하며, 값을 성질에 따라서 분류한 것

 

---

자바스크립트의 자료형은 원시자료형과 객체 자료형 2가지로 나뉩니다.

원시자료형은 5개로 객체 자료형은 3개로 나뉘게 됩니다.

이번 포스팅 글에서는 원시자료형 5개를 정리했습니다.

자바스크립트의 자료형

원시자료형이란?

네이버 어학사전에서 원시 뜻

원시 자료형, 기본 타입을 의미합니다. 원시 자료형은 한 번에 단 하나의 값만 가질 수 있는 Type입니다.

반대로 말하면 동시에 여러 개의 값을 가질 수 없는 뜻이 됩니다.

예를 들어 숫자형 자료형을 보여드리겠습니다.

let age = 25, 30; // 문법 오류

 

---

1. 숫자형(Nuber Type)

자바스크립트에서 숫자형에 들어가는 수는 종류를 구분하지 않습니다. 소수, 음수, 실수 등의 모든 수를 같은 종류의 '수'로 통일한 의미로 사용합니다.

let age = 25;
let tall = 175.9;
let minus = -20;

C언어나 JAVA에서는 정수와 소수를 각각 다른 선언형으로 구분하지만 자바스크립트에서는 모든 종류의 숫자를 '숫자형' 하나로 처리합니다.

자바스크립트는 숫자형을 가지고 사칙연산과 모듈러 연산(나머지 구하는)을 수행합니다.

console.log(1 + 2); // 3
console.log(1 * 2); // 2
console.log(1 - 2); // -1
console.log(1 / 2); // 0.5

console.log(1 % 2); // 모듈러 연산 1

 

숫자형에는 정수, 실수 말고도 일반적이지 않은 값들이 있습니다.

let inf = Infinity;
let mInf = -Infinity;
let nan = NaN;

Infinity는 양의 무한대,

-Infinity는 음의 무한대를 의미하며 최댓값과 최솟값을 구할때 사용됩니다.

자바나 C에서는 어떠한 수를 0으로 나누면 오류가 발생하지만, 자바스크립트에서는 Infinity라는 결과가 나온다는 특징이 있습니다.

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

 

NaN(Not a Number)은 표현이 불가능한 숫자형의 결과를 표현할 때 사용하는 값, 예를들어 숫자와 문자열을 곱하면 숫자가 아닌 비정상적인 값이 나오므로 NaN이라는 값을 얻습니다.

const nan1 = 1 * "hello";
const nan2 = 1 - "hello";
const nan3 = 1 / "hello";

console.log(nan1); // NaN
console.log(nan2); // NaN
console.log(nan3); // NaN

---

2. 문자형(String Type)

문자형은 사람의 이름과 같이 문자를 포함하는 자료형입니다.

let myName = "이정환";

문자형이라는 것을 전달하기 위해서는 몬자를 큰따옴표 " " 또는 작은 따옴표 ' '로 감싸야 합니다.

두개의 문자열 값이 저장된 변수 두개를 합쳐서 새로운 문자를 만들기 위해서는 +를 사용하면 됩니다.

let name = "이정환";
let welcomeText = "님 반가워요!";
let resultWelcomeText = name + welcomeText;

console.log(resultWelcomeText); // 이정환님 반가워요!

 

큰따옴표나 작은따옴표 말고도 문자형을 만들 수 있습니다.

바로 '백틱'을 사용하는 것인데요. 

let guestName = "이정환"; ①
let greetingText = `welcome ${guestName}!` ②
console.log(greetingText); // welcome 이정환!

1) 변수 guestName에 "이정환"; 이라는 문자열을 저장합니다.

2) 변수 greetingText에 백틱으로 감싼 문자열을 저장합니다. 백틱으로 감싼 문자열은 따옴표로 감싼 문자열과 동일한 문자형이지만, ${ } 안에 있는 변숫값도 문자열로 변환합니다. 결과적으로 변수 greetingText에는 welcome 이정환! 이라는 문자열이 저장됩니다.

 

백틱을 사용하면 문자열 사이에 변수를 사용할 수 있어, 값이 변하는 동적인 문자열 생성에 유용합니다.

백틱을 이용한 문자열을 흔히 '템플릿 리터럴' 이라고 합니다.

let name = "이정환";
let location = "역곡";
let introduce = `${name}은 ${location}에 살고 있습니다.`;

console.log(introduce); // 이정환은 역곡에 살고 있습니다.

---

3. 불리언형(Boolean Type)

불리언 형은 참(true)과 거짓(false)만을 저장하는 자료형입니다.

let isSwitchOn = false;

console.log(isSwitchOn); // false

불리언 형은 작업을 성공적으로 종료 했는지, 어떤 값이 있는지 등등을 확인할 때 사용됩니다.

---

4. null형(null Type)

null은 '아무것도 없다'라는 뜻으로, 변수에 아무 값도 할당할 필요가 없을 때 사용됩니다.

let emptyVar = null;

console.log(emptyVar); // null;

 

---

5. Undefined형(undefined Type)

undefined는 '미정의 값'이라는 뜻입니다. C나 자바에서는 변수를 생성하고 아무런 값도 할당하지 않으면 null을 갖습니다. 하지만 자바스크립트에서는 null 대신 undefined를 갖게 됩니다.

let realEmptyVar;

console.log(realEmptyVar); // undefined