Javascript 데이터 타입

2023. 1. 14. 14:28JavaScript/Modern Javascript

목차
1. 데이터 타입
2. Number(숫자)
3. BigInt(숫자)
4. String(문자열)
5. Boolean(불린형, true / false)
6. Null
7. Undefined
8. Object(객체형)
9 연산자 typeof

1. 데이터 타입

 

자바스크립트에서 값이란 항상 문자열(String), 숫자형(Number), 객체(Object) 등과 같은 특정 자료형에 속해있다.

 

자바스크립트에서는 크게 2가지, 원시형태와 객체형태로 나뉘고, 그 안에서 좀 더 세분화해서 나누어져 있다.

 

원시형태

  • Number(숫자)
  • BigInt(숫자, 정수)
  • String(문자열)
  • Boolean(참 / 거짓)
  • Null
  • Undefined
  • Symbol

 

객체형태

  • Object(객체)
  • Array(배열)
  • ...

 


2. Number(숫자)

 

Number 타입은 정수, 소수를 나타낼 수 있다.

 

숫자형과 관련된 연산은 곱셈( * ), 나눗셈( / ), 덧셈( + ), 뺄셈( - ) 등이 가능하다.

 

Infinity, -Infinity, NaN특수 숫자 값( Special Number Value )에 포함된다.

 

Infinity는 무한대를 의미하고, NaN은 계산 중에 에러가 발생함을 의미한다.

 

여기에서 NaN은 어떤 연산을 진행하더라도 바뀌지 않고 NaN을 출력한다.

 

 예시(Sample) 

console.log(10 / 0) // Infinity

console.log(-10 / 0) // -Infinity

console.log("나눌 수 없다"/2) // NaN

 


3.  BigInt (숫자)

 

위의 숫자형은 -2^53부터  2^53까지 표현이 되었다.

 

그 이후의 숫자는 Number가 아닌 BigInt로 값을 사용할 수 있다.

 

일반적인 상황에서 Number로 써도 무방하지만, 암호와 관련된 특수 상황에서는 아주 큰 숫자가 필요하거나,

 

높은 정밀도를 요구하는 작업에서는 이런 큰 숫자가 필요하기 때문에 생겨났다.

 

예시 코드와 같이 끝에 n이 붙는다는 특징이 있다.

 

 예시(Sample) 

console.log(BigInt(123412341)) // 123412341n

 


4. String(문자열)

 

자바스크립트에서는 String(문자열)을 따옴표( " " )로 묶어야한다.

 

  • 큰 따옴표, " "
  • 작은 따옴표, ' '
  • 역 따옴표(백틱), ` `

일반적으로 큰 따옴표와 작은 따옴표를 사용하는데, 자바스크립트에서는 이 둘의 차이는 없다.

 

하지만, 키보드 숫자키 1 왼쪽에 있는 백틱(` `)은 조금 다른 기능을 가지고있다.

 

백틱으로 변수나 식(표현식)을 감싸 ${ } 안에 넣어, 가변값(변수, 식)을 표현할 수 있다.

 

예시(Sample)

let nickname = "char1ey"

// 큰 따옴표
console.log("Hello ${nickname}") // Hello ${nickname}

// 백틱
console.log(`Hello ${nickname}`) // Hello char1ey

 

 

변수뿐만 아니라 식(표현식)이 들어가서 결과값을 나타내어 주기도 한다.

 

예시(Sample)

let nickname = "char1ey"
let welcome = "hello world!, "

console.log(`${welcome + nickname}`) // hello world!, char1ey

console.log(`${10 + 20}`) // 30

 


5. Boolean(불린형, true / false)

 

Boolean은 논리타입이라고도 하며, true 혹은 false 두 가지 값만 있다.

 

긍정(참, true) 혹은 부정(거짓, false)을 나타내는 값을 저장한다.

 

일반적으로 if문과 함께 쓰이는 경우나, O,X 값을 표현해야할 때 쓰인다.

 

물론 아래와 같이 쓰이는 일은 없다.

 

예시(Sample)

if(true){
	console.log(1)
} else {
	console.log(2)
} // 1


if(false){
	console.log(1)
} else {
	console.log(2)
} // 2

 


6. Null

 

다른 언어와는 조금 다르게 자바스크립트에서는 Null은 다음의 경우에 사용된다.

 

  • 존재하지 않는(nothing)
  • 비어 있는(empty)
  • 알 수 없는(unknown)

 


7. Undefined

 

Null과 헷갈리지 않도록하자, undefined는 "값이 할당되지 않은 상태"를 나타낸다.

 

일반적으로, 변수를 선언하고 값을 할당하지 않은 채로 둔다면 undefined가 할당된다.

 

이 외에도 데이터를 전송하는 과정에서 데이터가 올바르게 오지 못했다면 자주 접할 수 있다.

 

직접 undefined를 할당할 수 있지만, 값이 비어있다는것을 나타내고 싶다면, Null을 사용하도록 하자.

 


8. Object(객체형)

 

위의 원시타입 데이터들은 한 가지 혹은 한 종류의 데이터를 담을 수 있다.

 

하지만, 객체는 데이터들의 집합에 대해 나타낼 수 있다. 즉, 여러가지 데이터를 한 곳에 담을 수 있다.

 

어느 제품의 정보를 나타내기 위해서는 가격, 모양, 기능들을 알아야 하는데, 이를 표현하기 위해선 객체만한 것이 없다.

 

현실에 존재하는 개체를 표현하기 위해서 객체를 사용하곤한다.

 

객체는 자바스크립트에서 매우 중요하므로 따로 더 깊게 알아보도록 하자.

 


9. 연산자 typeof

 

typeof 연산자를 사용하면 해당 인수의 자료형을 알 수 있다.

 

typeof [판별할 인수]

 

예시(Sample)

console.log(typeof undefined) // undefined
console.log(typeof null) // object
console.log(typeof "문자") // string
console.log(typeof 123) // number

 

다만, 위의 예시에서 null 값이 object로 출력되는 것은 자바스크립트에서 어떤 이유에서 용인해둔 오류이다.

 

null이 object로 출력되었다고해서 object 타입은 아니다.

 

 

 


참고자료
https://ko.javascript.info/types

'JavaScript > Modern Javascript' 카테고리의 다른 글

Javascript 논리 연산자  (1) 2023.01.14
Javascript 조건문  (0) 2023.01.14
Javascript 형변환  (0) 2023.01.14
Javascript 객체와 in 연산자  (0) 2023.01.11
Javascript 함수(선언식, 표현식, 화살표 함수)  (0) 2023.01.11