자바스크립트 타입

자바스크립트는 동적 타이핑(dynamic typing) 언어이기 때문에 변수를 선언할 때 특정 타입을 지정하지 않는다. 그 대신 자바스크립트 엔진이 실행 시점에 변수의 타입을 결정하게 된다. 그럼에도 불구하고, 자바스크립트는 몇 가지 기본 데이터 타입들을 가지고 있다.

자바스크립트의 데이터 타입은 크게 두 가지 카테고리(원시(primitive) 타입과 객체(object)타입
)로 나눌 수 있다.

원시타입: Boolean, String, Number, null, undefined, Symbol(불변성을 가지고 있다.)

참조타입: Object, Array

1. 원시 타입(Primitive Types)

원시 타입은 변경 불가능(immutable)하며, 이들의 값은 메모리에 직접 저장된다.

Number

모든 숫자를 나타내는 타입이다. 정수와 부동 소수점 모두 포함된다.

let x = 3.14;  // 부동 소수점 숫자
let y = 42;    // 정수

String

텍스트 데이터를 나타내는 타입이다.

let name = "ChatGPT";

Boolean

참(true) 또는 거짓(false)의 논리 값을 나타내는 타입이다.

let isTrue = true;

Undefined

값이 할당되지 않은 변수의 타입과 값이다.

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

Null

명시적으로 값이 없음을 나타내는 타입과 값이다.

let empty = null;

Symbol(ES6부터 존재)

유일하게 변경 불가능한 원시 값으로 주로 객체 속성의 키로 사용된다.

const sym = Symbol('description');

Bigint

아주 큰 정수를 나타내기 위한 타입이다.

const bigIntValue = 1234567890123456789012345678901234567890n;

예제

let foo = 42
console.log(typeof foo) // number

foo = 'bar'
console.log(typeof foo) // string

foo = true
console.log(typeof foo) // boolean

2.객체 타입(Object Types)

객체는 속성의 집합으로 구성되며, 각 속성은 키와 값의 쌍으로 이루어져 있다. 객체의 값은 메모리에 참조로 저장되며, 객체 자체는 변경 가능(mutable)하다.

Object

키-값 쌍의 집합이다.

let person = {
  name: "John",
  age: 30
};

Array

순서가 있는 값의 목록이다.

let fruits = ["apple", "banana", "cherry"];

Function

실행 가능한 코드 블록이다.

function greet() {
  console.log("Hello!");
}

예제

const hobbies = ['walking', 'books'];
const address = {
    province: '경기도',
    city: '성남시'
}

console.log(typeof hobbies) // object
console.log(Array.isArray(hobbies)) // true

console.log(typeof address) // object
console.log(Array.isArray(address)) // false

Data, RegExp, Error 등 기타 내장 객체 타입이 있다.

3.원시타입과 객체

자바스크립트의 원시 타입(Primitive Types)과 객체를 이해하기 위해선 메모리 내의 Call Stack과 Heap에 대한 개념을 알아야 한다. 이 두 영역은 데이터를 저장하는 방식과 원시 타입과 객체가 어떻게 동작하는지 이해하는 데 중요한 역할을 한다.

Call Stack

• Call Stack은 함수의 실행 순서를 추적하는 구조다.
• 자바스크립트는 단일 스레드 언어이므로 한 번에 하나의 함수만 실행할 수 있다.
• 함수를 호출하면 해당 함수는 스택의 맨 위에 푸시되며, 함수의 실행이 완료되면 스택에서 팝되어 제거된다.
• 원시 타입(Primitive Types)의 데이터는 직접 Call Stack 안에 저장된다. 이는 원시 타입의 값들이 고정된 크기를 가지기 때문에 스택에 저장하기에 적합하다는 것을 의미한다. 예를 들면, Number, Boolean, String (짧은 문자열), Undefined, Null 등의 원시 타입은 Call Stack 내에서 직접 관리된다.

Heap

• Heap은 대부분의 구조화된 데이터, 즉 객체(object)나 긴 문자열 등을 저장하는 영역이다.
• 객체는 크기가 가변적이고, 동적으로 크기가 변경될 수 있기 때문에 Heap에 저장되는 것이 적합하다.
• 객체나 배열을 생성하면, 그 데이터는 Heap 내부에 저장되며, Call Stack 내의 해당 변수는 이 데이터를 참조하는 포인터(또는 참조)를 저장하게 됩니다. 따라서 변수 자체에는 객체의 모든 데이터가 아니라 해당 객체를 "가리키는" 주소값만 저장된다.

예제

let number = 42;    // 원시 타입: Call Stack에 직접 저장됨
let name = "John";  // 원시 타입 (짧은 문자열): Call Stack에 직접 저장됨

let person = {      // 객체: Heap에 저장됨
    name: "John",
    age: 30
};

// 'person' 변수는 Call Stack에 있지만, 그 값은 Heap에 있는 객체를 "참조" 합니다.

요약하면, 원시 타입은 대개 Call Stack에 직접 저장되며, 객체와 같은 복잡한 데이터 타입은 Heap에 저장되어 Call Stack에서 참조된다. 이러한 차이는 원시 타입과 객체 타입의 값 전달 방식 및 성능 최적화에서 중요한 역할을 한다.

4. 자바스크립트는 동적 타입이다.

JavaScript는 느슨한 타입(loosely typed)의 동적(dynamic)언어이다.
JavaScript의 변수는 어떤 특정 타입과 연결되지 않으며, 모든 타입의 값으로 할당 (및 재할당) 가능하다.
이는 자바스크립트 엔진이 실행 시(runtime)에 변수의 타입을 결정하고 관리한다는 것을 의미한다.

let foo = 42 // foo가 숫자
foo = 'bar' // foo가 이제 문자열
foo = true // foo가 이제 불리언

최근에는 TypeScript와 같은 정적 타입 체크를 제공하는 자바스크립트의 상위 집합 언어들이 인기를 얻고 있다. TypeScript는 자바스크립트의 동적 타이핑의 유연성과 정적 타이핑의 안정성을 결합하여 개발자들에게 선택적인 타입 시스템을 제공한다.

동적 타이핑의 장점

1. 유연성: 빠르게 프로토타이핑하거나 작은 스크립트를 작성할 때 편리하며, 타입에 대한 걱정 없이 쉽게 코드를 작성할 수 있다.
2. 간결성: 변수 타입을 명시하지 않아도 되므로 코드가 간결해진다.
3. 같은 변수가 여러개의 타입을 가질 수있다.

동적 타이핑의 단점

1. 런타임 에러: 컴파일 시간에 타입 체크가 이루어지지 않기 때문에 잘못된 타입의 값이 사용될때 에러는 런타임에 발생한다. 이는 버그를 찾기 어렵게 만들 수 있다.
2. 예측성 감소: 코드를 읽는 도중 변수의 타입을 확신할 수 없기 때문에 코드의 예측성이 감소할 수 있다.

Sum

이러한 타입들은 자바스크립트에서 데이터를 다루는 데 필요한 기본적인 구성 요소이다. 각 타입은 고유한 성질과 특성을 가지며, 자바스크립트 코드를 작성하면서 이러한 타입들의 특성을 이해하고 활용하는 것이 중요하다.