BACKEND [Kamranahmedse Roadmap]/JavaScript

[JS] JavaScript의 동적 타입(Dynamic Typing) 완전 정리

Alex Han 2025. 2. 12. 19:25
반응형

1. 동적 타입(Dynamic Typing)이란?

동적 타입(dynamic typing) 이란, 변수를 선언할 때 자료형을 명시하지 않고 실행 중(runtime)에 자료형이 결정되는 방식을 의미한다.

즉, JavaScript에서는 변수를 선언할 때 자료형(type)을 지정하지 않으며, 변수에 저장된 값에 따라 자동으로 타입이 변한다.

let x = 10;  // x는 number 타입
x = "Hello"; // x는 string 타입으로 변경됨
x = true;    // x는 boolean 타입으로 변경됨

 

위 코드처럼, 변수 x는 저장되는 값에 따라 자동으로 자료형이 변한다. 이런 특징을 동적 타이핑(Dynamic Typing) 이라고 한다.

 

 

 


2. JavaScript의 주요 데이터 타입

JavaScript는 기본적으로 7가지 원시 타입(Primitive Type)1가지 객체 타입(Object Type) 을 제공한다.

 

✅ 원시 타입(Primitive Types)

데이터 타입 예시 설명
Number 42, 3.14 정수, 실수 모두 포함
String "hello", 'world' 문자열 데이터
Boolean true, false 논리 값
Undefined undefined 변수가 선언되었지만 값이 할당되지 않음
Null null 값이 비어 있음을 의미
Symbol Symbol('id') 유일한 값 생성 (ES6)
BigInt 123n 매우 큰 정수를 다룰 때 사용 (ES11)

 

✅ 객체 타입(Object Type)

데이터 타입 예시 설명
Object { name: "Alex", age: 21 } 여러 속성을 포함하는 데이터
Array [1, 2, 3] 리스트 형태의 데이터
Function function() {} 함수도 객체의 한 종류

 

 

 


3. 동적 타입(Dynamic Typing)의 특징

 

1) 변수의 타입이 자유롭게 변할 수 있음

let data = 10;    // number
data = "hello";   // string
data = true;      // boolean

 

같은 변수 data에 여러 가지 타입의 값을 할당할 수 있다.

(장점) 유연한 코딩 가능.

(단점) 예상치 못한 타입 변환이 일어날 수 있음.


2) 타입 변환(Type Coercion)이 자동으로 발생

JavaScript는 자동으로 타입을 변환하려고 한다.

이것을 강제 형 변환(Implicit Type Conversion) 이라고 한다.

console.log(1 + "2");  // "12" (number + string → string)
console.log("3" * "2"); // 6 (string * string → number)
console.log("5" - 1);   // 4 (string - number → number)
console.log(0 == false); // true (boolean → number)

 

1 + "2" → 숫자가 문자열로 변환되어 "12"가 된다.

"3" * "2" → 문자열이 숫자로 변환되어 6이 된다.

"5" - 1"5"가 숫자로 변환되어 4가 된다.

0 == falsefalse0으로 변환되어 true가 된다.

(주의: ===는 타입까지 비교하므로 0 === false는 false가 된다.)


3) typeof 연산자로 타입 확인 가능

변수의 타입을 확인하려면 typeof 연산자를 사용하면 된다.

console.log(typeof 42);       // "number"
console.log(typeof "hello");  // "string"
console.log(typeof true);     // "boolean"
console.log(typeof undefined);// "undefined"
console.log(typeof null);     // "object" (버그로 인해 이렇게 출력됨)
console.log(typeof {});       // "object"
console.log(typeof []);       // "object"
console.log(typeof function(){}); // "function"

 

(주의) typeof null이 "object"로 나오는 것은 JavaScript의 오래된 버그이다.

 

typeof보다 toString.call()을 사용하는 이유

 

[JS] toString.call() 완전 정리

1. toString.call() 이란?toString.call(value)은 객체의 정확한 타입을 판별하는 방법 중 하나이다.이는 Object.prototype.toString() 메서드를 활용하여 모든 JavaScript 값의 내부 [[Class]]를 반환하는 방식으로 동작

jyhan0625.tistory.com

 

 

 


4. 동적 타이핑의 장점과 단점

 

✅ 장점

1) 코드가 유연하다

같은 변수에 여러 타입의 데이터를 저장할 수 있어 활용성이 높음.

예를 들어, x = 10 후에 x = "hello"를 할당해도 문제 없음.

 

2) 변수 선언 시 타입을 미리 지정할 필요 없음

int, string 같은 타입 선언이 필요 없으므로 간단하게 코딩 가능.

 

3) 빠른 프로토타이핑 가능

동적 타이핑 덕분에 짧은 시간 내에 빠르게 코드를 작성하고 실행 가능.


✅ 단점

1) 타입 오류 발생 가능

number라고 생각한 값이 string이면 오류 발생 가능.

let result = 5 - "hello"; // NaN (Not a Number)

 

2) 디버깅이 어려울 수 있음

예상치 못한 타입 변환이 발생할 경우 버그를 찾기 어려움.

console.log(1 + "2"); // "12"
console.log(1 - "2"); // -1

 

3) 실행 성능 저하

동적 타입 언어는 런타임에 타입을 결정하므로 정적 타입 언어(C, Java)보다 성능이 낮을 수 있음.

 

 

 


5. 동적 타입의 단점을 보완하는 방법

 

1) === (일치 연산자) 사용

자동 타입 변환을 피하려면 == 대신 === 을 사용하여 엄격한 비교를 해야 한다.

console.log(0 == false);  // true  (자동 변환됨)
console.log(0 === false); // false (타입까지 비교)

 

2) TypeScript 사용

JavaScript의 동적 타이핑 문제를 해결하기 위해 TypeScript 를 사용할 수 있다.

TypeScript는 정적 타입(Static Typing) 을 지원하여 미리 타입을 지정할 수 있다.

let num: number = 10;
num = "hello"; // ❌ 타입 오류 발생

 

3) typeof 연산자로 타입 확인

예기치 않은 타입 오류를 방지하려면 typeof 연산자로 변수를 체크할 수 있다.

function add(a, b) {
    if (typeof a !== "number" || typeof b !== "number") {
        throw new Error("숫자만 입력하세요!");
    }
    return a + b;
}

console.log(add(5, "3")); // 오류 발생

 

 

 


6. 결론

JavaScript는 동적 타입(Dynamic Typing) 언어로, 변수의 타입이 실행 중에 변경될 수 있다.

자동 타입 변환(Type Coercion) 이 발생하므로 예기치 않은 결과가 나올 수 있다.

타입을 엄격하게 관리하려면 === 연산자, TypeScript, typeof 체크 등을 활용하는 것이 좋다.

 

➡️ 동적 타이핑은 유연하지만 신중하게 사용해야 한다! 🚀

반응형