Notice
Recent Posts
Recent Comments
Link
JiSoo's Devlog
[타입스크립트로 블록체인 만들기] Functions 본문
함수의 call signature 타입 만들기
type Add = (a:number, b:number) => number;
const add:Add = (a, b) => a + b;
a:number, b:number 이렇게 할 필요 X
오버로딩은 함수가 서로 다른 여러 개의 call signatures를 가지고 있을 때 발생시킨다
직접 작성하기보다 외부 라이브러리에 자주 보이는 형태
다른 여러 개의 argument를 가지고 있을 때 발생하는 효과
type Add = {
(a:number, b:number) : number
(a:number, b:string) : number
}
const add: Add = (a, b) =>{
if(typeof b === "string") return a
return a+b
}
type Add2 = {
(a: number, b: number): number,
(a: number, b: number, c: number): number
}
const add2: Add2 = (a, b, c?: number) => {
if (c) return a + b + c;
return a + b;
}
polymorphism 다형성 (여러 타입을 받아들임으로써 여러 형태를 가지는 것)
concrete type -> number, boolean, void 등 지금까지 배운 타입
generic type -> 타입의 placeholder 같은 것으로 concrete type 대신 사용 가능
제네릭은 기본적으로 placeholder를 사용해 작성한 코드의 타입 기준으로 바꿔준다
type SuperPrint = {
<TypePlaceholder>(arr: TypePlaceholder[]):void
}
const superPrint: SuperPrint = (arr) => {
arr.forEach(i => console.log(i))
}
superPrint([1, 2, 3, 4])
superPrint([true, false, true, true])
superPrint(["a", "b", "c", "d"])
superPrint([1, 2, true, false, "hi"])
type SuperPrint = {
<T>(arr: T[]): T
}
const superPrint: SuperPrint = (arr) => arr[0]
const a=superPrint([1,2,3])
const b=superPrint([true,false,true])
const c=superPrint(["a","b"])
const d=superPrint([1,2,"a","b",true])
타입스크립트에게 타입을 유추하도록 알려준 것
함수의 call signature을 입력할 때 placeholder 사용 -> 다형성
타입스크립트는 제네릭을 처음 인식했을 때와 제네릭의 순서를 기반으로 제네릭의 타입을 알게 된다
type SuperPrint = <T, M>(a: T[], b:M) => T
const sueprPrint:SuperPrint = (a) => a[0]
const a = superPrint([1, 2, 3, 4], "x")
const b = superPrint([true, false, true], 1)
function superPrint<T>(a: T[]){
return a[0]
}
제네릭을 사용해 타입을 생성, 확장 가능
type Player<E> = {
name:string
extraInfo:E
}
type JisooExtra = {
favFood: string
}
type JisooPlayer = Player<JisooExtra>
const jisoo: JisooPlayer = {
name:"jisoo",
extraInfo: {
favFood:"kimchi"
}
}
const lynn: Player<null> = {
name: "lynn"
extraInfo: null
}
타입을 생성하고 그 타입을 또다른 타입에 넣어 사용도 가능
많은 것들이 들어있는 큰 타입을 가지고 있는데 그중 하나가 달라질 수 있는 타입이라면 제네릭 사용
type A = Array<number>
let a:A = [1, 2, 3, 4]
useState<number>()
useState의 call signature이 number 타입의 useState가 되는 것
728x90
'Frontend > Typescript' 카테고리의 다른 글
[Udemy React 완벽 가이드] 리액트 + TypeScript (1) | 2024.06.04 |
---|---|
[타입스크립트로 블록체인 만들기] Typescript Blockchain (0) | 2024.04.20 |
[타입스크립트로 블록체인 만들기] Classes and interfaces (0) | 2024.04.17 |
[타입스크립트로 블록체인 만들기] Overview of Typescript (0) | 2024.03.31 |