반응형

함수 타입 인터페이스 만들기

함수의 타입은 매개변수와 반환 값으로 정의할 수 있습니다. 인터페이스를 사용하며 해당 함수 타입에 이름을 지정할 수 있습니다. 인터페이스로 함수를 지정함으로 코드가 더 읽기 쉽게 만들고 선언한 타입을 더 재사용 가능하게 만들어 줍니다.

아래 함수가 있습니다.

CreateString 함수는 문자열 및 숫자 매개변수를 사용하고 문자열을 반환합니다. 

StringGen이라는 새 변수를 선언하였습니다. StringGen은 CreateString의 시그니처와 일치하는 함수 타입을 갖도록 선언하고 있습니다. 그런 다음 CreateString을 StringGen 변수에 할당할 수 있습니다.

위 같은 함수 타입 선언도 잘 작동하지만 여러 곳에서 사용하려면 한 곳에서 타입을 정의하는 것이 좋습니다.

함수 타입 인터페이스

인터페이스로 함수 타입을 선언해 주었습니다. 함수 시그니처는 다른 인터페이스와 마찬가지로 중괄호 안에 지정되지만 구문은 StringGen 변수에 대해 만든 함수 타입 선언과 약간 다릅니다.

콜론으로 작성하는 것에 주의

화살표 대신 매개변수와 함수 반환 타입 사이에 콜론을 사용하는 것에 주의해주세요. 이제 인터페이스를 정의했으니 StringGen 선언을 변경할 수 있습니다.

함수 타입 인터페이스로 변수 타입 설정

이쪽 코드가 훨씬 읽기 쉬어진 것 같습니다. 이제 비슷한 함수가 필요할 때 다른 곳에서 StringGenerator를 사용할 수 있습니다. 함수 인터페이스를 정의해서 사용하는 간단한 실습을 하도록 하겠습니다.


함수 타입 인터페이스 실습

먼저 별도 인터페이스 파일을 만들어 인터페이스를 추가하도록 하겠습니다.

interfaces.ts 파일을 만들었고 Logger라는 이름의 함수 타입을 가지는 인터페이스를 선언하였습니다. 함수 인터페이스를 정의할 때 매개변수 뒤에 화살표 대신 콜론을 배치하여 반환 값을 지정한다는 것을 기억해주세요. Logger 인터페이스를 다른 곳에서도 사용할 수 있도록 export 했습니다. export 해주므로 다른 파일인 index.ts 파일에서 import 하여 사용할 수 있게 되었습니다.

MyLogger라는 Logger 타입의 새 변수를 선언해 주었습니다. 타입스크립트는 이제 변수에 함수가 포함된다는 것을 알고 있고 함수에 있어야 하는 서명은 알지만 구현은 알 수 없는 상태입니다. 따라서 함수를 제공해 주어야 합니다. myLogger에 화살표 함수를 할당해 주었습니다. 그런 다음 다른 함수 호출과 마찬가지로 괄호 안에 문자열 매개변수를 전달하여 myLogger 변수를 사용하여 함수를 호출을 하고 있습니다.

 

컴파일 후 실행해보면 아래와 같이 로그가 문자열이 잘 출력되고 있습니다.

 


 

여기까지 읽어 주셔서 감사합니다.

반응형
  • 네이버 블러그 공유하기
  • 네이버 밴드에 공유하기
  • 페이스북 공유하기
  • 카카오스토리 공유하기