반응형
* 본 포스팅은 필자가 개인적으로 학습한 내용정리 및 리뷰를 위해 포스팅합니다.
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의 앞에+를 붙이면 해결되는 신기한 장면도 보았다..
반응형
'TypeScript' 카테고리의 다른 글
[TypeScript] object index signature (인덱스 서명) (0) | 2023.11.01 |
---|---|
[TypeScript] implements 키워드 (1) | 2023.10.31 |
[TypeScript] class / object 타입 지정 (0) | 2023.10.19 |
[TypeScript] 색다르게 타입도 변수에 담아서 쓰자(type alias) (0) | 2023.10.18 |
[TypeScript] 함수에 타입 지정하는 법 (4) | 2023.10.17 |
댓글