데이터 타입과 타입 추론
왜 데이터 타입이 중요한가?
Javascript 에서는 변수에 어떤 데이터 타입의 값도 할당할 수 있다.
이러한 유연성은 편리하지만, 예기치 않은 오류를 유발할 가능성이 있다.
let myName = 'lee';
myName = 1; // 문자열에서 숫자로 변경됨위와 같이 변수의 타입이 의도치 않게 변경되면,
코드의 안정성이 떨어지고 오류가 발생할 가능성이 높아진다.
하지만 Javascript 자체는 이러한 문제를 사전에 막지 못한다.
타입스크립트의 타입 추론 (Type Inference)
Typescript 는 타입 추론 기능을 통해 변수의 타입을 자동으로 판단할 수 있다.
Typescript 컴파일러는 초기 할당된 값을 바탕으로 변수의 타입을 추론한다.
let age = 30;위의 코드에서 age 변수는 자동으로 number 타입으로 추론된다.
타입 추론 을 활용하면 코드가 간결해지지만,
복잡한 로직에서는 명시적으로 타입을 지정하는 것이 더 안전하다.
데이터 타입의 종류
Typescript 는 다양한 데이터 타입을 지원하며,
크게 기본 데이터 타입, 객체 타입, 특수 타입으로 나눌 수 있다.
기본 데이터 타입
- number : 정수와 실수를 포함하는 숫자 타입
- string : 문자열 타입
- boolean : 참(
true), 거짓(false)을 나타내는 불리언 타입 - null : 값이 없음을 나타내는 타입
- undefined : 값이 할당되지 않은 변수를 나타내는 타입
객체 타입
- object : 객체를 나타내는 타입
- array : 동일한 타입의 요소를 가진 배열을 나타내는 타입
- tuple : 각 요소가 서로 다른 타입을 가질 수 있는 배열을 나타내는 타입
특수 타입
- any : 어떤 타입이든 할당될 수 있는 타입
- unknown : 타입을 미리 알 수 없을 때 사용하는 타입
타입스크립트에서의 타입 명시
변수의 타입 명시
변수를 선언할 때 타입을 명시함으로써, 변수의 데이터 타입을 고정할 수 있다.
let myName: string = 'lee';
myName = 1; // 오류 발생위 코드에서 myName 변수는 string 타입으로 선언되었기 때문에 숫자를 할당하면 컴파일 오류가 발생한다.
let stdId: number = 1111;
let stdName: string = 'lee';
let age: number = 20;
let gender: string = 'male';
let course: string = 'Typescript';
let completed: boolean = false;타입스크립트 인터페이스
인터페이스 는 특정 객체의 구조를 정의하는 데 사용되며, 클래스나 객체에서 활용할 수 있다.
인터페이스의 특징
string이나number타입처럼 데이터 타입으로 사용 가능- 선택적 프로퍼티를 지정하려면 속성명 뒤에
?를 붙임 - 메소드도 인터페이스 내에서 선언 가능
- 클래스를 통해 인터페이스를 상속할 수 있음
enum GenderType {
Male = 'male',
Female = 'female',
GenderNeutral = 'neutral'
}
interface Student {
stdId: number;
stdName?: string;
age?: number;
gender?: GenderType;
course?: string;
completed?: boolean;
setName: (name: string) => void;
}인터페이스 를 활용하면 특정 구조를 따르는 객체를 만들 수 있다.
let std: Student = {
stdId: 91011,
stdName: 'park',
age: 30,
gender: GenderType.Male,
course: 'node.js',
completed: true,
setName(name: string) {
this.stdName = name;
console.log(`이름 설정: ${this.stdName}`);
}
};클래스에서 인터페이스 사용
인터페이스 를 클래스로 구현할 수도 있다.
class MyStudent implements Student {
stdId = 91011;
stdName = 'park';
age = 30;
gender = GenderType.Female;
course = 'node.js';
completed = true;
setName(name: string): void {
this.stdName = name;
console.log(`이름 설정: ${this.stdName}`);
}
}클래스 인스턴스를 생성하고 메소드를 호출할 수 있다.
const MyInstance = new MyStudent();
MyInstance.setName("Kim");함수의 데이터 타입 명시
함수의 매개변수와 반환 타입에도 명시적으로 타입을 지정할 수 있다.
function plus(a: number, b: number): number {
return a + b;
}이렇게 하면 plus 함수는 두 개의 number 타입 인자를 받아, number 타입 결과를 반환한다.
Typescript 의 타입 명시는 코드의 가독성과 안정성을 높이는 중요한 역할을 한다.
🔨 TIL
오늘 Typescript 를 처음 만져봤다.
어렵게만 느꼈는데 막상 직접 해보니 타입만 지정해주고
어렵게 느껴지지 않았다.
왜 Typescript 를 사용하는지도 이해할 수 있었다.
