[JavaScript] 자료형

Joowon Jang·2024년 6월 19일

목록 보기

2/17

JavaScript의 자료형

JavaScript의 변수는 자료형에 관계없이 모든 데이터일 수 있다.
따라서 변수는 어떤 순간에 문자열일 수 있고 다른 순간엔 숫자가 될 수도 있다.

let message = "hello";
message = 123456;

이처럼 자료의 타입은 있지만 변수에 저장되는 값의 타입은 언제든지 바꿀 수 있는 언어를 ‘동적 타입(dynamically typed)’ 언어라고 한다.

8가지 자료형

JavaScript에는 총 8가지 자료형이 있는데, 7가지의 원시 자료형(primitive data types)과 1가지의 참조 자료형(reference data type)이 있다.

원시 자료형

하나의 데이터만 담을 수 있는 자료형
기본 자료형이라고도 한다.

1. 숫자형(Number)

정수 및 부동소수점 숫자(floating point number)을 나타낸다.

let n = 123;
n = 12.345;

숫자형엔 일반적인 숫자 외에 Infinity, -Infinity, NaN같은 '특수 숫자 값(special numeric value)'이 포함된다.
NaN은 계산 중에 에러가 발생했다는 것을 나타내주는 값이다. 부정확하거나 정의되지 않은 수학 연산을 사용하면 계산 중에 에러가 발생하는데, 이때 NaN이 반환된다.

2. BigInt

(2^53-1)보다 큰 값 혹은 -(2^53-1)보다 작은 정수는 '숫자형’을 사용해 나타낼 수 없다.
아래와 같이 끝에 n을 붙여서 나타낸다.

const bigInt = 1234567890123456789012345678901234567890n;

3. 문자형(String)

따옴표(", ') 또는 백틱(역따옴표)(`)을 사용해서 문자를 나타낸다.

let str = "Hello World";
let str2 = 'Hi World';
let str3 = `First is always ${str}`;

자바스크립트에서는 큰따옴표와 작은따옴표에 차이를 두지 않는다.
역 따옴표로 변수나 표현식을 감싼 후 ${…}안에 넣어주면, 원하는 변수나 표현식을 문자열 중간에 손쉽게 넣을 수 있다.

4. 논리형(Boolean)

true와 false 두 가지 값밖에 없는 자료형이다.
true는 긍정(참), false는 부정(거짓)을 나타낸다.

let a = true;
let b = false;
console.log(1 > 2) // false

5. null

null은 null 한 가지만 포함하는 자료형이다.
존재하지 않는(nothing)값, 비어 있는(empty)값을 나타내는 데 사용한다.

let name = null;

(의도적으로, 명시적으로 없는 값이라는 것을 알려주는 점에서 undefined와 다르다)

6. undefined

undefined도 null처럼 undefined 한가지만 포함하는 자료형이다.
undefined는 '값이 할당되지 않은 상태’를 나타낸다.
변수는 선언했지만, 값을 할당하지 않았다면 해당 변수에 undefined가 자동으로 할당된다.

let name;
console.log(name); // undefined

let age = undefined;

마지막 줄처럼 undefined를 직접 할당할 수도 있지만, 비어있는 값을 의도적으로 나타낼 때에는 null을 사용하기 때문에 undefined는 권장하지 않는다.

7. 심볼형(symbol)

객체(Object)의 고유한 식별자(unique identifier)를 만들 때 사용된다.
심볼형에 대해서는 추후에 따로 정리해서 포스팅할 예정

참조 자료형

다양한 데이터를 담을 수 있는 자료형
데이터 집합이나 복잡한 개체(entity)를 저장할 수 있다.

객체(Object)

객체는 중괄호 {…}를 이용해 만들 수 있다.
중괄호 안에는 ‘키(key): 값(value)’ 쌍으로 구성된 프로퍼티(property) 를 여러 개 넣을 수 있는데, 키엔 문자형, 값엔 모든 자료형이 허용된다.

let user = new Object(); // '객체 생성자' 문법
let user = {};  // '객체 리터럴' 문법

만드는 방법에는 두 가지가 있으며, 아래처럼 키:값 쌍으로 프로퍼티를 할당하고 키를 통해 접근할 수 있다.

let user = {
  'name': 'joowon',
  'age': 27
}

console.log(user.age); // 27

typeof 연산자

typeof 연산자를 사용하면 데이터의 자료형을 알 수 있다.

typeof undefined // "undefined"
typeof 0 // "number"
typeof 10n // "bigint"
typeof true // "boolean"
typeof "foo" // "string"
typeof Symbol("id") // "symbol"
typeof Math // "object"
typeof null // "object"
typeof alert // "function"

위의 코드처럼 사용하며, 반환 값은 문자형이다.
null의 타입이 object인 것은 오류이지만, 하위 호환성 유지를 위해 남겨두었다고 한다.
마지막 줄과 같이 함수는 "function"을 반환하는데, '함수형'은 존재하지 않고 함수는 '객체'에 속하기 때문에 잘못되었지만, 이 또한 하위 호환성 유지를 위해 남겨두었다.