티스토리 뷰
🍞 제네릭 클래스
클래스의 이름 뒤에 타입 변수를 선언하면 제네릭 클래스가 된다.
Number 타입의 리스트를 생성하는 클래스를 만들어보자.
class NumberList {
constructor(private list: number[]){}
push(data: number){
this.list.push(data);
}
pop(){
return this.list.pop();
}
print(){
console.log(this.list);
}
}
- list 필드를 private으로 설정해 클래스 내부에서만 접근할 수 있도록 한다.
- 새로운 요소를 추가하는 push, 제거하는 pop, 출력하는 print 메소드를 만들어 준다.
이 NumberList 클래스로 인스턴스를 만들어 사용해보자.
const numberList = new NumberList([1, 2, 3]);
numberList.pop();
numberList.push(4);
numberList.print(); // [1, 2, 4]
정상적으로 잘 작동하고 있다.
그런데 여기서 만약 동일한 구조를 가진 StringList 클래스를 만들어야 한다면 어떻게 할까?
새로운 클래스를 하나 더 만드는 것은 매우 비효율적일 것이다.
// NumberList 클래스
class NumberList {
constructor(private list: number[]){}
push(data: number){
this.list.push(data);
}
pop(){
return this.list.pop();
}
print(){
console.log(this.list);
}
}
// StringList 클래스
class StringList {
constructor(private list: string[]) {}
push(data: string) {
this.list.push(data);
}
pop() {
return this.list.pop();
}
print() {
console.log(this.list);
}
}
const numberList = new NumberList([1, 2, 3]);
const numberList = new StringList(["1", "2", "3"]);
여기서 추가로 모든 리스트에 동일한 메소드가 추가되거나 동작이 수정되야 한다면? 일일이 바꾸는 것에는 한계가 존재할 것이다.
따라서 제네릭 클래스를 이용해 여러 타입의 리스트를 생성할 수 있는 범용적인 클래스를 정의한다.
// 동일한 형태의 StringList 클래스도 필요하다면?
// -> 새로운 클래스를 하나 더 만드는 대신 제네릭 클래스로 만들기
class List<T> {
constructor(private list: T[]){}
push(data: T){
this.list.push(data);
}
pop(){
return this.list.pop();
}
print(){
console.log(this.list);
}
}
const numberList2 = new List([1, 2, 3]);
numberList.pop();
numberList.push(4);
numberList.print(); // [1, 2, 4]
const stringList = new List(['1', '2']);
stringList.pop();
stringList.push('hello');
stringList.print(); // ['1', 'hello']
- 클래스의 이름 뒤에 타입 변수를 선언한다.
타입 변수는 클래스 내부에서 자유롭게 사용이 가능하며 생성자를 통해 타입 변수의 타입을 추론할 수 있기 때문에 생성자에 인수로 전달하는 값이 있을 경우 타입 변수에 할당할 타입을 생략해도 된다.
만약 타입 변수의 타입을 직접 설정하길 원하는 경우 명시해주면 된다.
const numberList = new List<number>([1, 2, 3]);
const stringList = new List<string>(['1', '2']);
728x90
'코딩 > 한 입 크기로 잘라먹는 타입스크립트' 카테고리의 다른 글
[TypeScript] 타입 조작 - 인덱스드 엑세스 타입 (0) | 2023.09.18 |
---|---|
[TypeScript] 프로미스와 제네릭 (0) | 2023.09.16 |
[TypeScript] 제네릭 인터페이스와 제네릭 타입 별칭 (0) | 2023.09.15 |
[TypeScript] map, forEach 메소드 타입 정하기 (0) | 2023.09.14 |
[TypeScript] 제네릭 함수와 타입 변수 (1) | 2023.09.13 |