자바스크립트의 데이터 타입

 

자바스크립트는 동적 타입으로 느슨한 언어 타입 체크 언어로써 값이 할당되는 과정에 타입 추론이 되는 특징이 있습니다.

자바스크립트는 원시 자료형과 참조 자료형(객체)로 구분할 수 있는 데이터 타입을 갖습니다.

데이터 타입은 프로그래밍 언어에서 사용할 수 있는 데이터의 종류를 말하며 메모리에 데이터를 저장하고 변수로 해당 데이터를 이용할 수 있습니다. 자바스크립트의 모든 값은 데이터 타입을 가지며 7개의 데이터 타입을 제공합니다.

 

1. 원시 타입(Primitive Types)

• Boolean
• Number
• String
• Null
• Undefined
• Symbol

2. 참조 타입(Reference Types / Object)

• Object

원시 타입

1. Boolean

const bar = true;
const foo = false;

console.log(bar); // true
console.log(foo); // false
console.log(typeof bar); // boolean

Boolean은 true와 false 두 가지 값을 가질 수 있는 논리형 데이터 타입입니다.
null과 undefined, 0, " "은 자바스크립트에서 false로 간주되는 특징이 있습니다.

 

2. Number

const int = 10; // 정수
const minusInt = -23; // 음수
const float = 10.20; // 실수
const bigInt = 9007199254740992n; // BigInt

console.log(42 / +0); // +Infinity
console.log(42 / -0); // -Infinity
console.log(1 * 'a'); // NaN

숫자형 데이터 타입으로 자바스크립트는 Number와 BigInt 두 가지 숫자 타입을 가지고 있으며 +Infinity, -Infinity, NaN 세 가지의 상징적인 값을 가지고 있습니다.

 

숫자 타입의 값은 64비트 부동소수점 형을 따르며 모든 수를 실수로 처리합니다. 때문에 이 범위를 벗어나는 큰 수를 표현하기 위해 BigInt 타입을 제공합니다. 정수 끝에 n을 추가하거나 생성자로 생성할 수 있습니다. 주의할 것으로 Number와 혼합 연산할 수 없습니다.

 

NaN은 산술로 연산이 불가능하다는 뜻인 Not a Number의 줄임말입니다.

+Infinity와 -Infinity는 임의의 수를 0으로 나눌 때 발생하는 값입니다. Infinity를 연산식에 사용하게 되면 그 결과는 Infinity 또는 NaN으로만 나오기 때문에 주의해야 합니다.

 

3. String

let str1 = "hello";
str1 += " world";
console.log(str); // hello world

let str2 = "string";
str2 = "String";
console.log(str2); // String

let str2 = 'hello "js"';
console.log(str2); // hello "js"
console.log(str2[0]); // h

String은 문자열 데이터를 의미합니다. 문자열은 유니코드 문자들의 집합으로 작은따옴표, 큰 따옴표 또는 백 틱으로 생성할 수 있습니다.

 

문자열은 원시 타입이며 변경 불가능한 특성을 가지고 있습니다. 문자열은 한 번 생성되면 변경할 수 없지만 재할당은 가능합니다. 위의 str1이나 str2 변수는 문자열을 변경한 것처럼 보이지만 새로운 문자열을 생성하고 재할당한 것입니다. 때문에 기존의 str1이나 str2가 가리키는 "hello"와 "string"은 메모리에 그대로 존재하고 있는 상태입니다.

 

또한 문자열은 유사 배열 형태로 배열처럼 인덱스를 통해 접근할 수도 있습니다.

 

4. Null과 Undefined

let foo = "hello";
foo = null;
console.log(foo); // null
console.log(typeof foo); // object

let bar;
console.log(bar); // undefined
console.log(typeof bar); // undefined

console.log(foo == bar); // true
console.log(foo === bar); // false

Null과 Undefined는 각각 null, undefined만을 유일한 값으로 가집니다.

 

Null은 존재하지 않는다라는 뜻을 가지며 개발자가 명시적으로 값이 없다라고 표현하기 위해 사용합니다. typeof 연산자로 비교해보면 object라고 나오는 데 이것은 자바스크립트의 설계 상 오류라고 합니다.

 

Undefined는 정의되지 않음이라는 뜻이며 할당되지 않은 변수의 값을 자바스크립트 엔진이 초기화한 것입니다. 따라서 선언만 한 변수는 모두 undefined 값을 갖게 됩니다.

 

Null과 Undefined은 둘 다 값이 없는 상태이며 동등 연산자로 비교해보면 true가 나오는 것을 확인할 수 있습니다. 하지만 Null은 값이 없다라는 특별한 값으로 초기화를 한 것이고, Undefined는 초기화도 되지 않은 것이기 때문에 분명한 차이가 있습니다.

 

5. Symbol

const symbol1 = Symbol();
const symbol2 = Symbol(42);
const symbol3 = Symbol('foo');

console.log(typeof symbol1); // symbol
console.log(symbol2 === 42); // false
console.log(symbol3.toString()); // Symbol(foo)
console.log(Symbol('foo') === Symbol('foo')); // false

Symbol은 ES6에서 새로 추가된 데이터 타입으로 고유하며 변경 불가능한 원시 타입입니다. 객체 프로퍼티에 대한 식별자로 사용하기 위해 생성합니다.

 

Symbol은 new 연산자로 생성하는 것이 아닌 Symbol() 함수를 통해 생성할 수 있으며 이 때 생성된 심볼 값은 고유하며 유일하다는 특징을 가지고 있습니다.

 

객체 타입

객체는 위의 원시 타입을 제외한 모든 타입을 가리킵니다. 자바스크립트는 객체 기반의 스크립트 언어이며 객체 지향의 특징을 가지고 있고 객체로 이루어져 있습니다.

 

객체는 자바의 클래스와 같이 데이터와 동작(메서드)를 포함할 수 있는 데이터 타입입니다. 객체는 다른 객체를 포함할 수도 있으며 자바스크립트의 함수는 일급 객체로 취급되기 때문에 함수 또한 가질 수 있습니다. 이때 함수와 구분하기 위해 메서드라고 부릅니다.

const human = {
    name: "Sian",
    age: 28,
    job: "Developer",
    sayHello() {
        console.log("Hello!");
    }
}

console.log(human.name); // Sian
console.log(human.age); // 28
human.sayHello(); // Hello!

객체는 위와 같이 생성할 수 있습니다. 이름과 나이, 직업을 가리키는 데이터가 있으며 sayHello라는 메서드를 가지고 있는 객체입니다.

객체는 . 연산자로 접근해서 해당 객체가 가진 데이터나 메서드를 사용할 수 있습니다. 

 

참고링크
https://poiemaweb.com/js-data-type-variable
https://developer.mozilla.org/ko/docs/Web/JavaScript/Data_structures