5/1(일) - TypeScript function -1

Call Signature

type Add = (a:number,b:number) => number

const add = (a,b) => a+b //error 각 인자들이 any타입이기때문에 안됨
//number + string 등 '+' 연산자는 정해진 타입에만 쓸수있기때문에

const add = (a:number,b:number) => a+b //ok! 타입추론을통해 a+b가 넘버인걸 아니까 타입지정을 안해도됨

const add:Add = (a,b)=>a+b
//call signature 함수를 어떻게 호출해야되는지 알려주는 느낌? (마우스를 hover해보면 보임)

Overloading

함수가 여러개의 call signature를 가질때

type Add = {
	(a:number,b:number):number
    (a:number,b:string):number //생각해보면 기본적으로 문제가있는거 아닌가..싶기도..
}

const add:Add = (a,b) => a+b //error! b의 타입이 number|string이기때문에 

const add:Add = (a,b) => {
	if(typeof b === 'string') return a
    return a+b

Add타입의 call signature가 다수이고, b의 타입이 string|number이기 때문에 탈출구를 만들어서 b의 타입이 number로 고정일때만 a+b를 리턴하는 형태
=> but 일상적이지 않은 케이스기때문에 와닿지 않을수 있지만..

일상적인 Case (인자의 타입이 다수일 가능성이 있을때)

call signature가 다수일때 라고해야할려나?

Next.js (써보지는 않았다..)

type Config = {path:string,state:object}
type Push = {
	(path:string):void //push메소드는 return이 없나부지? 그래서 void?
    (obj:Config):void
}
Router.push('/home')
Router.push({
	path:'/home',
    state:1
 })

const push:Push = (config) => {
	if(typeof(config) === 'string){console.log(config)}
    else{console.log(config.path)} //ok!

Case2 = call signature가 다수, 인수의 개수도 각각 다름

type Add = {
	(a:number,b:number):number
    //해석하면 인수c는 optional이라는것
    (a:number,b:number,c:number):number
    
const add:Add = (a,b,c) => {return a+b+c}
//error! call signature를 보면 c의 인수가 없을수도있다.
그러니 c의 타입을 모르는 케이스가 있을수 있으니까 error가 나온다

const add:Add = (a,b,c?:number) => {
	if(c) return a+b+c
    return a+b
}
//ok! c가있을때 를 탈출구로 만들고 인자 c에 ?를 붙혀서 optional로 하고 number라고 추론을 적어놓은 느낌이다.

아직 다배운게 아니라서 상당부분 틀릴수도있다 하지만 오늘까지 배운것중에 확실한건 optional의 탈출구를 잘 만들어놔야겠다 라는 생각이다.