today i worked 5/6: TypeScript 매개변수

9-18 사무실 출근

1. 오늘 회사에 나포함 네명옴

2. 오늘 휴가쓸걸 후회중..

3. 상품판매등록 모달완성하고 상품정보 확인/수정용 컴포넌트 만들기..?

 

TypeScript에서 여러 매개변수를 받아올 때

함수의 매개변수는 최대 두개까지 받아오는 게 좋다. 그 이상으로 받아올 경우라면 객체로 불러오거나 아예 타입을 선언하여 그 타입을 매개변수에 넣어주는 형태로 불러오는 것이 훨씬 좋다.

 

Bad: 함수에서 매개변수를 선언할 때 각각이 무슨 역할을 하는지 다시 찾아봐야하는 불편함이 존재함. 함수가 기대하는 속성이 명확하지 않음

const calculateSum = (
  firstNum: number,
  secondNum: number,
  thirdNum: number
) => {
  return firstNum + secondNum + thirdNum
}

calculateSum(1, 2, 3)

Good 1: 객체로 불러오기

const calculateSum = (options: {
  firstNum: number
  secondNum: number
  thirdNum: number
}) => {
  return options.firstNum + options.secondNum + options.thirdNum
}

calculateSum({
  firstNum: 1,
  secondNum: 2,
  thirdNum: 3,
})

Good 2: 타입 앨리어스 사용: 가독성이 1번째 Good 케이스보다 더 높아짐

type NumberOptions = {
  firstNum: number,
  secondNum: number,
  thirdNum: number,
}

const calculateSum = (numbers: NumberOptions) => {
  return numbers.firstNum + numbers.secondNum + numbers.thirdNum
}

calculateSum({
  firstNum: 1,
  secondNum: 2,
  thirdNum: 3,
})