logo
Published on

타입스크립트 프로그래밍 4장 함수

Authors
  • avatar
    Name
    Bora Choi
    Twitter

함수 선언과 호출

함수를 선언하는 5가지 방법

  • 이름을 붙인 함수
    function printName(name: string) {
      return `My name is ${name}`
    }
    
  • 함수 표현식
    let printName = function (name: string) {
      return `My name is ${name}`
    }
    
  • 화살표 함수 표현식
    let printName = (name: string) => {
      return `My name is ${name}`
    }
    
  • 단축형 함수 표현식
    let printName =(name:string) => 	return `My name is ${name}`
    
  • 함수 생성자 (사용지양)
    let printName = new Function('name', 'return `My name is ${name}`')
    
    → 함수 생성자의 경우 Function 타입이기때문에 Function.porotype 의 모든 프로토타입 메서드를 포함한다. 하지만 매개변타입과 반환 타입을 지정하지 않았으므로 타입 불안정!

타입스크립트에서 함수를 호출할 때 타입 정보는 따로 제공할 필요가 없으며, 바로 인수를 전달하면 타입스크립트가 함수의 매개변수와 인수의 타입이 호환되는지 확인한다.

함수 매개변수와 반환값 타입

선택적 매개변수와 기본 매개변수

? 을 사용한 선택적 매개변수 지정가능, 기본 매개변수에도 타입을 설정할 수 있다.

가변 인자의 경우

일반적으로 arguments 객체를 통해 함수에 가변인자를 전달 할 수 있었다. 하지만 타입 추론이 되지 않는다는 문제점이 있다.

...변수명 을 사용하면 해결 할 수 있다. 최대 한 개의 나머지 매개 변수, 매개변수 맨 마지막에 위치해야한다.

그외

  • tsconfig.js에 strictBindCallAppy를 활성화시키면 call, apply, bind 를 안전하게 사용할 수 있다.
  • 제네레이터, 반복자 지원
  • this의 타입지정 가능

함수 자체 타입

호출 시그니처

;(a: number, b: number) => number
  • 호출 시그니처는 타입 정보만 포함.
  • 매개변수 타입, this타입,반환타입, 나머지 타입, 조건부 타입을 표현할 수 있지만 기본 값은 표현할 수 없다(기본값은 타입이 아니라 값).
  • 바디를 포함하지 않아 타입스크립트가 타입을 추론할 수 없으므로 반환 타입을 명시해야한다

오버로드된 함수 타입

전체 호출 시그니처를 사용해 함수 타입을 오버로딩할 수 있다.

type Reserve = {
  (from: Date, to: Date, destination: string): Reservation
  (from: Date, destination: string): Reservation
}

다형성

제네릭

함수의 기능을 일반화하여 설명하기 좋음

제네릭 타입의 선언 위치에 따라 타입의 범위뿐 아니라 타입스크립트가 제네릭 타입을 언제 구체 타입을 한정하는지도 결정된다.

type Filter = {
  <T>(array: T[], f: (item: T) => boolean): T[]
}
type Filter<T> = {
  (array: T[], f: (item: T) => boolean): T[]
}

extends 와 &

제네릭 타입에 extends를 사용하여 타입을 한정시킬 수 있다

function mapNode<T extends TreeNode>(nod: T, f: (value: string) => string): T {
  return {
    ...node,
    value: f(node.value),
  }
}

여러개를 추가하려면 인터섹션(&) 으로 제한을 이어붙이면 된다