Post

데이터 타입에 대해 알아보자

안녕하세요. 오늘은 데이터 타입에 대해 정리하려고 합니다. 여러모로 부족한 부분이 있을 수 있으나 양해부탁드립니다.

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

자바스크립트는 동적 타이핑(dynamic typing)을 사용하는 언어로, 변수에 여러 종류의 데이터를 저장할 수 있습니다. 자바스크립트의 데이터 타입은 크게 원시 타입(Primitive Types)객체 타입(Object Types)으로 나뉩니다.

1. 원시 타입 (Primitive Types)

원시 타입은 하나의 값만을 가지며, 변경할 수 없는(immutable) 데이터입니다. 자바스크립트는 다음과 같은 원시 타입을 지원합니다:

  • 숫자(Number)
  • 문자열(String)
  • 불리언(Boolean)
  • null
  • undefined
  • 심볼(Symbol)
  • BigInt

숫자 (Number)

숫자 타입은 정수와 실수를 모두 포함합니다. 자바스크립트에서는 모든 숫자가 64비트 부동 소수점 형식(IEEE 754)으로 저장됩니다.

1
2
3
4
let integer = 42;
let float = 3.14;
let notANumber = NaN; // 수학 연산이 잘못되었음을 나타내는 값
let infinity = Infinity; // 무한대를 나타내는 값

문자열 (String)

문자열 타입은 텍스트 데이터를 나타냅니다. 작은 따옴표(‘’), 큰 따옴표(“”), 또는 백틱(``)으로 감쌀 수 있으며, 문자열은 변경할 수 없습니다.

1
2
3
let single = 'Hello';
let double = "World";
let template = `Hello, ${double}!`; // 템플릿 리터럴을 사용한 문자열

문자열은 불변(immutable)이며, 문자열의 개별 문자는 변경할 수 없습니다. 대신 새로운 문자열을 생성해야 합니다.

1
2
3
let str = "Hello";
str[0] = 'h'; // 아무런 효과 없음
str = "hello"; // 새로운 문자열 할당

불리언 (Boolean)

불리언 타입은 참(true) 또는 거짓(false)의 두 가지 값만 가집니다.

1
2
let isTrue = true;
let isFalse = false;

불리언 타입은 조건문에서 자주 사용됩니다.

1
2
3
if (isTrue) {
    console.log("This is true");
}

null

null은 의도적으로 값이 비어 있음을 나타내는 특별한 값입니다. 일반적으로 변수가 객체를 가리키지 않음을 나타내기 위해 사용됩니다.

1
let empty = null;

undefined

undefined는 변수가 선언되었지만 아직 값이 할당되지 않은 상태를 나타냅니다.

1
2
let notAssigned;
console.log(notAssigned); // undefined

함수에서 값을 반환하지 않으면 반환 값은 자동으로 undefined입니다.

1
2
function noReturn() {}
console.log(noReturn()); // undefined

심볼 (Symbol)

심볼은 유일하고 변경 불가능한 값으로 주로 객체의 프로퍼티 키로 사용됩니다. 심볼은 Symbol 함수로 생성됩니다.

1
2
3
let sym1 = Symbol('description');
let sym2 = Symbol('description');
console.log(sym1 === sym2); // false (서로 다른 유일한 값)

심볼은 객체의 고유한 프로퍼티 키로 유용합니다.

1
2
3
4
let obj = {};
let sym = Symbol('key');
obj[sym] = 'value';
console.log(obj[sym]); // value

BigInt

BigInt는 임의의 정밀도를 가진 정수를 표현하기 위한 타입입니다. 일반적인 Number 타입이 다룰 수 없는 큰 정수를 표현할 수 있습니다.

1
2
let bigNumber = BigInt(1234567890123456789012345678901234567890);
console.log(bigNumber); // 1234567890123456789012345678901234567890n

BigInt는 ‘n’을 숫자 끝에 붙여서 표현할 수도 있습니다.

1
let anotherBigInt = 12345678901234567890n;

2. 객체 타입 (Object Types)

객체 타입은 여러 값을 키(key)-값(value) 쌍으로 구성된 복합 데이터 타입입니다. 객체는 변경 가능(mutable)하며, 다양한 형태로 사용할 수 있습니다.

객체 (Object)

객체는 중괄호 {}를 사용하여 정의하며, 키-값 쌍을 포함합니다. 객체의 키는 문자열 또는 심볼이어야 하며, 값은 모든 타입이 가능합니다.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
let person = {
    name: "John",
    age: 30,
    greet: function() {
        console.log("Hello!");
    }
};

// 프로퍼티 접근
console.log(person.name); // John
console.log(person["age"]); // 30

// 프로퍼티 추가
person.gender = "male";

// 프로퍼티 삭제
delete person.age;

// 메서드 호출
person.greet(); // Hello!

배열 (Array)

배열은 순서가 있는 리스트 형태의 객체로, 대괄호 []를 사용하여 정의합니다. 배열의 각 요소는 인덱스로 접근할 수 있으며, 인덱스는 0부터 시작합니다.

1
2
3
4
5
6
7
8
9
10
11
12
13
let numbers = [1, 2, 3, 4, 5];
console.log(numbers[0]); // 1

// 배열 길이
console.log(numbers.length); // 5

// 배열에 요소 추가
numbers.push(6);
console.log(numbers); // [1, 2, 3, 4, 5, 6]

// 배열에서 요소 제거
numbers.pop();
console.log(numbers); // [1, 2, 3, 4, 5]

함수 (Function)

함수는 실행 가능한 코드 블록으로, 함수 선언 또는 함수 표현식을 사용하여 정의합니다.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
// 함수 선언
function greet() {
    console.log("Hello, World!");
}
greet(); // Hello, World!

// 함수 표현식
let sayHello = function() {
    console.log("Hello, World!");
};
sayHello(); // Hello, World!

// 화살표 함수
let add = (a, b) => a + b;
console.log(add(2, 3)); // 5

함수는 일급 객체(first-class citizen)로, 변수에 할당하거나 다른 함수의 인수로 전달할 수 있으며, 함수에서 반환할 수도 있습니다.

1
2
3
4
function higherOrderFunction(callback) {
    callback();
}
higherOrderFunction(greet); // Hello, World!

날짜 (Date)

Date 객체는 날짜와 시간을 나타내며, 다양한 메서드를 통해 날짜와 시간을 조작할 수 있습니다.

1
2
3
4
5
let now = new Date();
console.log(now); // 현재 날짜와 시간

let specificDate = new Date('2020-01-01');
console.log(specificDate); // Wed Jan 01 2020

Date 객체는 날짜와 시간을 계산하거나 형식화할 때 유용합니다.

1
2
3
let future = new Date();
future.setDate(future.getDate() + 7); // 현재 날짜에 7일 추가
console.log(future);

정규 표현식 (RegExp)

RegExp 객체는 정규 표현식을 나타내며, 문자열 패턴 매칭에 사용됩니다.

1
2
let pattern = /ab+c/;
console.log(pattern.test("abbbc")); // true

정규 표현식은 문자열 검색, 매칭, 치환에 유용합니다.

1
2
3
let str = "Hello, World!";
let newStr = str.replace(/World/, "JavaScript");
console.log(newStr); // Hello, JavaScript!

Map과 Set

Map은 키-값 쌍을 저장하고, Set은 중복되지 않는 값을 저장합니다.

1
2
3
4
5
6
7
8
9
10
11
12
// Map
let map = new Map();
map.set('key', 'value');
console.log(map.get('key')); // value

// Set
let set = new Set();
set.add(1);
set.add(2);
set.add(2); // 중복된 값은 무시됨
console.log(set.has(1)); // true
console.log(set.size); // 2

원시 타입과 객체 타입의 차이점

  • 원시 타입: 변경 불가능한 값이며, 변수에 직접 값을 저장합니다.
  • 객체 타입: 변경 가능한 값이며, 변수는 객체에 대한 참조를 저장합니다.

예시

1
2
3
4
5
6
7
8
9
let a = 10;
let b = a;
b = 20;
console.log(a); // 10 (원시 타입은 값이 복사됨)

let obj1 = { name: "Alice" };
let obj2 = obj1;
obj2.name = "Bob";
console.log(obj1.name); // Bob (객체 타입은 참조가 복사됨)

원시 타입의 변수는 값을 복사하지만, 객체 타입의 변수는 참조를 복사합니다. 따라서 객체의 프로퍼티를 변경하면 원본 객체도 영향을 받습니다.

요약

자바스크립트의 데이터 타입은 원시 타입과 객체 타입으로 나뉘며, 원시 타입은 변경 불가능한 값, 객체 타입은 변경 가능한 값입니다. 각 타입의 특성을 이해

하면 자바스크립트의 변수를 보다 효율적으로 사용할 수 있습니다.

오늘도 필자의 부족한 글 읽어 주셔서 감사합니다.

This post is licensed under CC BY 4.0 by the author.