Menu
Coddy logo textTech

매개변수 및 반환값 타입 지정

Coddy JavaScript 여정의 TypeScript 소개 섹션에 포함된 레슨. 73개 중 22번째.

함수는 모든 애플리케이션의 기본 구성 요소이며, TypeScript는 함수가 수락하고 반환하는 데이터의 유형을 정확하게 지정할 수 있게 함으로써 함수를 더 안전하고 예측 가능하게 만듭니다. 함수에 타입 어노테이션(type annotations)을 추가하면, 무엇이 입력되고 무엇이 출력되는지를 정의하는 명확한 계약을 만드는 것입니다.

함수에 타입을 추가하려면, 각 매개변수 이름 뒤에 타입을 지정하고, 선택적으로 매개변수 목록 뒤에 반환 타입을 지정합니다:

function greet(name: string): string {
  return "Hello, " + name;
}

function multiply(a: number, b: number): number {
  return a * b;
}

구문은 간단한 패턴을 따릅니다: 각 매개변수에 대해 parameterName: type을 사용하고, 닫는 괄호 뒤에 : returnType을 사용합니다.

challenge icon

챌린지

쉬움

두 개의 number 타입 매개변수를 받아 그 합을 반환하는 add라는 이름의 함수를 생성하세요. 이 함수는 number라는 명시적인 반환 타입 어노테이션을 가져야 합니다.

string 타입의 firstNamestring 타입의 lastName이라는 두 개의 매개변수를 받는 getFullName이라는 이름의 또 다른 함수를 생성하세요. 이 함수는 이름과 성 사이에 공백이 있는 하나의 문자열로 전체 이름을 반환해야 합니다. string이라는 명시적인 반환 타입 어노테이션을 추가하세요.

number 타입의 ageboolean 타입의 hasLicense라는 두 개의 매개변수를 받는 isEligible이라는 이름의 세 번째 함수를 생성하세요. 이 함수는 나이가 18세 이상이고 면허가 있는 경우 true를 반환하고, 그렇지 않으면 false를 반환해야 합니다. boolean이라는 명시적인 반환 타입 어노테이션을 추가하세요.

다음 값들로 함수를 호출하고 결과를 출력하여 함수를 테스트하세요:

  • 1527을 사용하여 add 호출
  • "John""Smith"를 사용하여 getFullName 호출
  • 20true를 사용하여 isEligible 호출
  • 16true를 사용하여 isEligible 호출

각 결과를 위에 지정된 순서대로 별도의 줄에 출력하세요.

직접 해보기

// TODO: 여기에 코드를 작성하세요
// 명시적 반환 타입 어노테이션을 사용하여 add 함수를 생성하세요

// 명시적 반환 타입 어노테이션을 사용하여 getFullName 함수를 생성하세요

// 명시적 반환 타입 어노테이션을 사용하여 isEligible 함수를 생성하세요

// 함수를 테스트하고 결과를 출력하세요
// 15와 27을 사용하여 add를 호출하세요
// "John"과 "Smith"를 사용하여 getFullName을 호출하세요
// 20과 true를 사용하여 isEligible을 호출하세요
// 16과 true를 사용하여 isEligible을 호출하세요
quiz icon실력 점검

이 레슨에는 짧은 퀴즈가 포함되어 있습니다. 레슨을 시작해 문제를 풀고 진행 상황을 기록하세요.

TypeScript 소개의 모든 레슨

직접 연습해 보세요: 온라인 JavaScript 컴파일러