본문 바로가기
Javascript

[Javascript 💡] 원시 데이터 타입, 참조 데이터 타입(+ 래퍼 객체)

by nyeoo 2023. 12. 30.
  • 자바스크립트의 각 데이터 타입은 특정 종류의 값을 나타내며, 변수에 할당될 때 자바스크립트 엔진에서 해당 값을 어떻게 처리할지를 결정함

1. 원시 데이터 타입(Primitive Data Type)

  • 자바스크립트에서 원시 데이터 타입은 값을 단일 단위로 나타내며, 불변(immutable)하다는 특징을 가짐
  • 이러한 원시 데이터 타입들은 값이 복사될 때 메모리에 직접 저장되며, 각각 독립적인 공간을 차지함. 또한 원시 데이터 타입은 불변하므로 값을 변경하려면 새로운 값을 할당해야 함. 예시로, 문자열을 수정하는 경우 원본 문자열은 변경되지 않고, 새로운 문자열이 생성됨
타입 설명
문자열(string) 텍스트 데이터를 나타내며 작은 따옴표(')나 큰 따옴표(")로 감싸진 문자들의 시퀀스
var str = "Hello, World!";
숫자(number) 정수나 부동 소수점 숫자를 나타냄
var num = 42;
var floatNum = 3.14;
불리언(boolean) true 또는 false의 값 중 하나를 나타냄
var isTrue = true;
var isFalse = false;
심볼(symbol) 유일하고 변경 불가능한 값을 나타내며, 주로 객체 속성의 식별자로 사용
var symbol = Symbol("unique");
null 값이 존재하지 않음을 나타내는 특별한 원시 값
var nullValue = null;
undefined 변수가 초기화되지 않았거나 값이 할당되지 않은 상태를 나타냄
var undefinedValue;
BigInt 일반적인 숫자 데이터 타입인 Number보다 훨씬 큰 정수 값을 다룰 수 있음

2. 참조 데이터 타입

  • 자바스크립트에서 참조 타입은 주로 객체(object)를 가리키며, 이들은 원시 데이터 타입과는 다르게 값이 직접 변수에 저장되지 않고 메모리 상의 위치를 가리키는 참조(reference)가 변수에 저장됨
  • 참조 타입은 변수에 값이 할당될 때 실제 데이터가 아니라 데이터의 위치(메모리 주소)가 변수에 저장되며, 변수 간에 참조가 공유될 수 있습니다. 이로 인해 참조 타입은 원시 데이터 타입과는 다르게 복사 시에 값이 복제되는 것이 아니라 참조가 복제되기 때문에 주의 필요

Object (객체)

ㆍ객체는 키-값 쌍의 집합이며, 다양한 데이터 타입을 포함할 수 있음. 객체는 중괄호({ })를 사용하여 생성하며, 객체의 속성(프로퍼티)에 접근할 때는 점(.) 또는 대괄호([ ]) 표기법을 사용함

var person = {
  name: "John",
  age: 30,
  address: {
    city: "New York",
    zip: "10001"
  }
};

Array (배열)

ㆍ배열은 여러 값을 순서대로 저장하는 자료구조이며, 대괄호([ ])를 사용하여 생성

var fruits = ["apple", "banana", "orange"];

Function (함수)

ㆍ함수는 재사용 가능한 코드 블록을 나타내며, 변수에 할당하거나 다른 함수에 인자로 전달할 수 있음

function add(a, b) {
  return a + b;
}

Date (날짜)

ㆍDate 객체는 날짜와 시간 정보를 다루기 위해 사용

var now = new Date();
		
now.toString();
now.toLocaleString();
now.toLocaleDateString();
now.toLocaleTimeString();
now.getFullYear();
now.getMonth()+1;			// check~!!! (월 단위는 자바에서처럼 0부터 시작된다.)
now.getDate();
now.getHours();
now.getMinutes();
now.getSeconds();

// ※ 주의

var userDate1 = new Date("2023/11/15");		// ○
var userDate2 = new Date(2023, 11, 15);		// ○
var userDate3 = new Date(Nov, 15, 2023);	// ○
var userDate4 = new Date("2023-11-15");		// X
var userDate5 = new Date("20231115");`		// X

RegExp (정규 표현식)

ㆍRegExp 객체는 문자열에서 패턴 매칭을 위해 사용

var pattern = /[a-z]/;

기타 참조 타입

ㆍMap, Set, Promise 등의 자바스크립트에서 제공하는 다양한 내장 객체들도 참조 타입에 속함

 

래퍼 객체(Wrapper Object)

  • 래퍼객체(Wrapper Object)원시 데이터 타입(Primitive Data Type)객체처럼 다룰 수 있게끔 도와주는 객체. 원시 데이터 타입은 객체가 아니라 값 자체로 존재하는데, 때로는 객체처럼 메소드를 호출하거나 속성에 접근하는 것이 편리하므로 이때 래퍼 객체가 사용됨
  • 래퍼 객체는 원시 데이터 타입 값을 감싸서(래핑하여) 객체처럼 동작하게끔 함. 주의할 점은 래퍼 객체가 값 자체를 변경하지 않는다는 것. 즉, 래퍼 객체를 통해 속성을 읽거나 메소드를 호출해도 원시 값 자체는 변경되지 않음
  • 일반적으로 래퍼 객체는 new 키워드와 생성자를 사용하여 생성할 수 있음. 그러나 일반적으로 직접 래퍼 객체를 생성하지 않고, 원시 데이터 타입을 사용함. 자바스크립트 엔진은 필요한 경우에 원시 값을 자동으로 래퍼 객체로 변환하고, 작업이 완료되면 다시 원시 값으로 변환함
  • 래퍼 객체는 원시 값에 메서드와 속성을 제공하여 원시 데이터 타입을 객체처럼 다룰 수 있도록 도와주지만, 이를 사용할 때 성능에 영향을 미칠 수 있으므로 주의
종류 객체 생성방법
String 래퍼 객체 new String("Hello, World!")
→ new 연산자를 사용하지 않고 String 생성자 함수를 호출하면 문자열을 반환함
Number 래퍼 객체 new Number(42)
Boolean 래퍼 객체 new Boolean(true)
Symbol 래퍼 객체 Object(Symbol("unique"))
BigInt 래퍼 객체 Object(BigInt(42n))