콘텐츠기획자의 IT입문서

자바스크립트 자료형 10 본문

JavaScript

자바스크립트 자료형 10

lazy_cat 2022. 6. 24. 14:29

자바스크립트의 변수는 자료형에 관계없이 모든 데이터일 수 있으므로

어떤 순간에 문자열일 수 있고 다른 순간엔 숫자가 될 수도 있다!

// no error
let message = "hello";
message = 123456;

따라서 자바스크립트는 동적 타입 언어이다.

*동적 타입 언어 : 자료의 타입은 있지만 변수에 저장되는 값의 타입은 언제든지 바꿀 수 있는 언어.

 


자바스크립트에는 10가지 기본 자료형이 있다. 

자료형은 크게 원시 자료형참조 자료형으로 나뉜다.

 

*원시 자료형 : 한 가지 값만 표현할 수 있는 자료형.

*참조 자료형 : 데이터 컬렉션이나 복잡한 개체(entity)를 표현할 수 있는 자료형.

 

 

원시 자료형

1. 숫자 Number

= 정수 & 부동소수점 숫자

+) 숫자형엔 일반적인 숫자 외에 Infinity, -Infinity, NaN같은 특수 숫자 값이 포함된다.

 

Infinity

= 어떤 숫자보다 더 큰 특수값, 무한대를 의미. 

어떤 수이든 0으로 나누면 무한대가 되고, Infinity를 직접 참조할 수도 있다.

 

NaN

= 부정확하거나 정의되지 않은 수학연산을 사용할 때 에러가 발생했다는 것을 나타내주는 값.

NaN에 어떤 추가 연산을 해도 결국 NaN이 반환된다.

 

 

2. BigInt

= 길이에 상관없이 정수를 나타낸다. 정수 끝에 n을 붙이면 BinInt가 된다.

(자바스크립트에선 (253-1)(9007199254740991) 보다 큰 값 혹은 -(253-1) 보다 작은 정수는 '숫자형’을 사용해 나타낼 수 없기 때문에 따로 BigInt가 생긴 것.)

const bigInt = 1234567890123456789012345678901234567890n;

 


3.문자 String

= 말 그대로 문자형. 자바스크립트에선 문자열을 따옴표(큰/작은 따옴표)로 묶는다.

 

역 따옴표 (backtick)

= 원하는 변수나 표현식을 문자열 중간에 넣을 때 사용.

let phrase = `can embed another ${str}`;

 

 

4.불린 Boolean

= true와 false 두 가지 값밖에 없는 자료형. 비교 결과, 즉 긍정이나 부정을 나타내는 값을 저장할 때 사용한다.

 

 

5.null

= 존재하지 않는 값. 비어있는 값. 알 수 없는 값을 나타냄.

+) null의 typeof 연산은 "object"인데, 이는 언어상 오류다. null은 객체가 아님.

let age = null; //나이를 알 수 없거나 그 값이 비어있음을 의미.

 

 

6. undefined

= 값이 할당되지 않은 상태를 의미.

변수를 선언했지만, 값을 할당하지 않았다면 해당 변수에 undefined가 자동으로 할당된다.

let age;
alert(age); // 'undefined'가 출력

 

 

7. 심볼 Symbol

= 객체의 고유한 식별자, 즉 변경되지 않는 유일한 값이 필요할때 사용된다.

(ES2015 버전부터 신규 추가된 원시타입 값이지만 잘 사용되진 않는다고..)

 

 

참조 자료형

8. 배열 Array

= 인덱스를 가지는 복수의 자료를 저장할 수 있는 자료 구조.

 

배열의 특징

- 다양한 타입의 값을 저장할 수 있다.

- 배열 안에 배열을 넣을 수 있다.

- 배열을 만들때 리터럴 방식으로 [...] 표현할 수도 있고, 생성자 함수 new Array로도 만들 수 있다.

- 배열의 인덱스는 0부터 시작한다.

 

 

9. 객체 Object

=  key와 value 한 쌍의 데이터들을 저장하는 자료 구조.

 

객체의 특징

- 객체를 만들때 리터럴 방식으로 {...}  표현할 수 있고, 생성자 함수 new Object로도 만들 수 있다.

 

배열과의 차이점

- 배열 : 부가 설명 없이 비슷한 성격의 자료형을 보관.

- 객체 : 값을 설명하는 key값이 존재함.

 

 

10. 함수 Function

= 자바스크립트에선 함수도 객체로 취급한다.

 

 

Comments