본문 바로가기
TypeScript

[TypeScript] Generic 함수 만들기

by 딩박사 2023. 10. 25.
반응형

* 본 포스팅은 필자가 개인적으로 학습한 내용정리 및 리뷰를 위해 포스팅합니다.


function 함수(x :unknown[]) {
    return x[0]
}

let result = 함수([4,2])
console.log(result + 1) //'a' is of type 'unknown'

▲ result의 타입은 unknown이기 때문에 앞에서 배운 narrowing 또는 as를 사용해야 하는 불편함이 있다.

 

이를 해결하기 위해!!

 

function 함수<Type>(x :Type[]) :Type {
    return x[0]
}

let result = 함수<number>([4,2])
console.log(result)

▲ 파라미터로 타입을 입력하는 Generic 함수를 사용한다!!

 

 

 

function 함수<Type>(x : Type){
    return x - 1
}

let result = 함수<number>(10)

string이 올수도 있는 계산의 과정에서 에러가 뜨게 된다.

 

 

function 함수<Type extends number>(x : Type){
    return x - 1
}

let result = 함수<number>(10)

▲ 앞에서 배운 class나 object에서 사용하던 확장의 의미인 extends가 아닌 Generic 함수에서는 제한의 의미로 Type가 우측의 number라는 속성을 가졌는지~라는 의미이다.

 

 

 

 

 

 

결론

파라미터에서 함수를 받아서 사용하는 것은 유용한 것 같다. 

예외로 계산식에서의 에러 The left-hand side of an arithmetic operation must be of type 'any', 'number', 'bigint' or an enum type.  에 대해서 찾던 중 단항 연산자(Unary Operator)라고 해서 x의 앞에+를 붙이면 해결되는 신기한 장면도 보았다..

반응형

댓글