TS 기초 - 함수

HOONEY·2022년 1월 17일
0

Typescript

목록 보기
3/7
post-thumbnail

시작

  • 간단한 CRUD를 위해 화면을 React - Typescript 만들다 보니 Typescript에 대한 공부가 필요하다고 느꼈다. 단순히 변수에 타입을 정해주는 수준이 아닌 Typescript를 편하게 사용하기 위해 기초부터 공부해보려 한다.
    https://typescript-kr.github.io/pages/basic-types.html#%EC%86%8C%EA%B0%9C-introduction
  • 상단 사이트를 통해 공부하고 몰랐던 부분을 적어보고 내것으로 만들어보려 한다.

함수 타입 작성

  • JS와 같으며 매개변수와 리턴에 타입만 붙여주면 된다.
function add(x: number, y: number): number {
    return x + y;
}

let myAdd = function(x: number, y: number): number { return x + y };

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

  • JS에서는 모든 매개변수가 선택적이라 상관없지만 TS에서는 에러가 난다. 그래서 매개변수 뒤에 ?를 붙임으로 에러를 방지한다.
function buildName(firstName: string, lastName?: string) {
    if (lastName)
        return firstName + " " + lastName;
    else
        return firstName;
}

나머지 매개변수

  • 매개변수가 여러개 일 때 TS에서는 묶어줄 수 있다.
  • 나머지 매개변수의 수는 무한으로 취급한다.
function buildName(firstName: string, ...restOfName: string[]) {
    return firstName + " " + restOfName.join(" ");
}

// employeeName 은 "Joseph Samuel Lucas MacKinzie" 가 될것입니다.
let employeeName = buildName("Joseph", "Samuel", "Lucas", "MacKinzie");

오버로드

  • 함수명은 같고, 매개변수의 타입, 개수, 순서는 다른 함수를 말한다.
// 선언
function overLoadSample(a: string, b: number): void
function overLoadSample(a: string):void
function overLoadSample(a: number, b: string): void
// 정의
function overLoadSample(a: any, b?: any): void {
	console.log(a, b);
}
// 호출
overLoadSample("A", 1);
overLoadSample("A");
overLoadSample(1, "A");

다음 포스팅에 이어서...

profile
기록하는 블로그

0개의 댓글