인자의 타입과 함수의 반환타입을 알려줌. 마우스를 올렸을 때 뜨는 타입에 대한 정보.
type Add = (a: number, b:number) => number;
const add:Add = (a, b) => a + b;
함수가 서로 다른 여러 개의 call signatures를 가지고 있을 때 오버로딩이 발생함
// 예시 1
type Config = {
path: string,
state: object
}
type Push = {
(path: string): void
(config:Config): void
}
const push:Push = (config) => {
if(typeof config === "string") console.log(config)
console.log(config.path)
}
// 예시 2 - 파라미터의 개수가 다를 떄
type Add = {
(a: number, b: number) : number
(a: number, b: number, c: number): number,
}
const add:Add = (a, b, c?:number) => {
if(c) return a + b + c;
return a + b;
} // 파라미터 개수가 다를 떄 마지막에 적힌 추가 파라미터가 optional이며 아마도 number일거라고 얘기해줘야 에러표시가 없어짐
call signature을 작성할 때 들어올 인자의 확실한 타입을 모를 때 사용
concrete type(number, string, boolean, ..)인건 알지만 그 타입을 미리 알 수는 없을 때 => 타입스크립트가 알아서 추론하게 하는 것
type SuperPrint = {
//(arr: number[]): void
//(arr: boolean[]): void
//(arr: string[]): void
//generic을 쓸 거라는 것을 알려줘야 함
<TypePlaceholder> (arr: TypePlaceholder[]): void
}
const superPrint: SuperPrint = (arr) => {
arr.forEach(i => console.log(i))
}
superPrint([1, 2, 3, 4])
superPrint([true, false, true])
superPrint(["a", "b", "c"])
superPrint([1, 2, true, false, "hello"]);
결과값을 리턴할 때
type SuperPrint = {
<T>(arr: T[]) : T
}
const superPrint: SuperPrint = (arr) => arr[0]
const a = superPrint([1, 2, 3, 4])
const b = superPrint([true, false, true])
const c = superPrint(["a", "b", "c"])
const d = superPrint([1, 2, true, false, "hello"]);
인자가 여러개일 때
type SuperPrint = {
<T, M>(arr: T[], b:M) : T
}
const superPrint: SuperPrint = (arr) => arr[0]
const a = superPrint([1, 2, 3, 4], "x")
const b = superPrint([true, false, true], 1)
const c = superPrint(["a", "b", "c"], true)
const d = superPrint([1, 2, true, false, "hello"], []);
재사용 및 타입 커스텀
type Player<E> = {
name: string
extraInfo: E
}
type NicoExtra = {
favFood: string
}
type NicoPlayer = Player<NicoExtra>
const nico: NicoPlayer = {
name: "nico"
extraInfo: {
favFood: "kimchi"
}
}
const kyoorim: Player<null> = {
name: "kyoorim",
extraInfo: null
}
함수 외에 generic을 쓰는 경우
type A = Array<number>
let a: A = [1, 2, 3, 4]
function printAllNumbers(arr: Array<number>) {
...
}