인터페이스 소개

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

interfaces는 객체에 대한 타입 별칭과 동일한 기본 목적을 수행하지만, 다른 구문을 사용하며 몇 가지 고유한 기능을 제공합니다.

인터페이스는 interface 키워드 뒤에 인터페이스 이름과 중괄호 안의 객체 구조를 사용하여 선언합니다:

interface Animal {
  name: string;
  sound: string;
}

let dog: Animal = {
  name: "Buddy",
  sound: "Woof"
};

구문은 깔끔하고 간단합니다. 인터페이스 본문 안에 속성과 해당 타입을 나열하기만 하면 됩니다. 한 번 정의하면 타입 별칭과 마찬가지로 코드 어디에서든 인터페이스 이름을 타입 주석으로 사용할 수 있습니다.

챌린지

쉬움

Pet이라는 이름의 인터페이스를 만들고 다음 속성을 지정하세요:

유형이 string인 name
유형이 string인 species
유형이 number인 age
유형이 boolean인 isVaccinated

Vehicle이라는 이름의 인터페이스를 만들고 다음 속성을 지정하세요:

유형이 string인 make
유형이 string인 model
유형이 number인 year

인터페이스를 사용하여 다음 변수를 만드세요:

이름이 myDog이고 유형이 Pet인 변수를 만드세요. name은 "Buddy", species는 "Golden Retriever", age는 3, isVaccinated는 true로 설정하세요.
이름이 myCat이고 유형이 Pet인 변수를 만드세요. name은 "Whiskers", species는 "Persian", age는 2, isVaccinated는 false로 설정하세요.
이름이 myCar이고 유형이 Vehicle인 변수를 만드세요. make는 "Toyota", model은 "Camry", year는 2022로 설정하세요.

Pet 유형의 매개변수를 받아 "[name] is a [age]-year-old [species]" 형식의 string을 반환하는 describePet 함수를 만드세요.

Vehicle 유형의 매개변수를 받아 "[year] [make] [model]" 형식의 string을 반환하는 getVehicleInfo 함수를 만드세요.

다음 출력을 각각 별도의 줄에 출력하세요:

myDog를 사용하여 describePet을 호출하고 결과를 출력하세요.
myCat을 사용하여 describePet을 호출하고 결과를 출력하세요.
myCar를 사용하여 getVehicleInfo를 호출하고 결과를 출력하세요.
myDog의 예방 접종 상태(isVaccinated 속성)를 출력하세요.

직접 해보기

// TODO: 여기에 코드를 작성하세요

// Pet 인터페이스를 생성하세요

// Vehicle 인터페이스를 생성하세요

// 인터페이스를 사용하여 변수를 생성하세요

// describePet 함수를 생성하세요

// getVehicleInfo 함수를 생성하세요

// 필요한 출력을 출력하세요