타입스크립트의 기본 타입 알아보기
타입스크립트는 정적 타입 시스템을 기반으로 하는 언어로, 다양한 타입을 제공한다. 이를 통해 코드의 안정성과 가독성을 높일 수 있다. 이번 포스팅에서는 타입스크립트에서 가장 기본적으로 사용되는 타입들을 살펴보자.
1. 기본적인 타입
A. 숫자(Number)
number 타입은 정수와 소수를 모두 포함한다.
let age: number = 25;
let price: number = 99.99;
B. 문자열(String)
string 타입은 텍스트 데이터를 다룰 때 사용된다. 작은따옴표, 큰따옴표, 템플릿 리터럴을 지원한다.
let name: string = "John";
let message: string = `Hello, ${name}!`;
C. 불리언(Boolean)
boolean 타입은 참(true)과 거짓(false) 값을 가진다.
let isActive: boolean = true;
let hasPermission: boolean = false;
D. 배열(Array)
배열의 타입을 정의할 때는 요소 타입 뒤에 대괄호([])를 추가하거나, Array<요소 타입> 형태로 선언한다.
let numbers: number[] = [1, 2, 3, 4, 5];
let fruits: Array<string> = ["Apple", "Banana", "Cherry"];
E. 튜플(Tuple)
튜플은 고정된 길이와 각 요소의 타입을 명확히 정의할 수 있는 배열이다.
let user: [number, string] = [1, "John"];
F. 열거형(Enum)
enum은 숫자 또는 문자열 값의 집합에 이름을 부여할 수 있다.
enum Direction {
Up = 1,
Down,
Left,
Right,
}
let move: Direction = Direction.Up;
2. 특수 타입
A. any
any 타입은 모든 값을 허용하며, 타입 체크를 무력화한다. 타입스크립트의 장점을 잃게 되므로 꼭 필요한 경우에만 사용해야 한다.
let dynamicValue: any = 42;
dynamicValue = "A string"; // 가능
dynamicValue = true; // 가능
B. unknown
unknown은 any와 유사하지만, 보다 안전한 타입이다. unknown 타입의 값을 사용하려면 먼저 타입을 확인해야 한다.
let value: unknown = "Hello";
if (typeof value === "string") {
console.log(value.toUpperCase());
}
C. void
void는 함수에서 반환값이 없음(return 이 없음) 을 나타낼 때 사용된다.
function logMessage(message: string): void {
console.log(message);
}
D. never
never는 절대 값을 반환하지 않는 함수의 반환 타입으로 사용된다. 예를 들어, 무한 루프나 예외를 던지는 함수가 해당된다.
function throwError(message: string): never {
throw new Error(message);
}
3. 유니언 타입과 인터섹션 타입
A. 유니언 타입 (Union)
유니언 타입은 하나 이상의 타입을 허용할 수 있다. 파이프(|)를 사용하여 정의한다.
let id: number | string;
id = 123; // 가능
id = "ABC123"; // 가능
B. 인터섹션 타입 (Intersection)
인터섹션 타입은 여러 타입을 결합하여 모두 만족하는 타입을 생성한다. 앰퍼샌드(&)를 사용한다.
interface Person {
name: string;
}
interface Employee {
employeeId: number;
}
let worker: Person & Employee = {
name: "Alice",
employeeId: 101,
};
4. 타입 단언과 타입 가드
A. 타입 단언 (Type Assertion)
개발자가 특정 변수의 타입을 명확히 알 때 타입스크립트에 해당 타입을 알려줄 수 있다.
let value: any = "This is a string";
let length: number = (value as string).length;
B. 타입 가드 (Type Guard)
타입 체크를 수행하여 변수의 타입을 좁히는 기능이다.
function isString(value: unknown): value is string {
return typeof value === "string";
}
let input: unknown = "Hello";
if (isString(input)) {
console.log(input.toUpperCase());
}
5. 널 가능 타입과 선택적 속성
A. 널 가능 타입 (Nullable Types)
타입 뒤에 | null 또는 | undefined를 추가하여 해당 값이 null 또는 undefined일 수 있음을 명시한다.
let nullableValue: string | null = null;
nullableValue = "Hello";
B. 선택적 속성 (Optional Properties)
객체의 속성 중 일부를 선택적으로 정의할 수 있다.
interface User {
id: number;
name?: string; // 선택적 속성
}
let user: User = { id: 1 };
'Web & App > Frontend Study' 카테고리의 다른 글
| Next.Js 파헤치기 (1) | 2025.01.19 |
|---|---|
| Typescript 정리 및 마무리 (0) | 2025.01.19 |
| Typescript를 알아보자 (1) | 2025.01.16 |
| Query key에 대한 추가 설명 (0) | 2025.01.15 |
| React Query: 완벽한 마무리 정리 (0) | 2025.01.15 |