끄적이는 개발노트

Typescript 기본 사용법(3) - interface 본문

JavaScript/Typescript

Typescript 기본 사용법(3) - interface

크런키스틱 2021. 10. 14. 12:02
728x90

이번 포스트에서는 interface에 대해 알아본다.

 

대부분의 경우, 데이터를 Object 형태로 넘겨준다.

이를 사용하기 위해서 사용되는 개념이 interface로 완성된 예제 코드는 아래와 같다.

// index.ts

interface Human {
    name: string;
    age: number;
    gender: string;
}

const person = {
    name: "HBC",
    age: 26,
    gender: "male"
}

const sayHi = (person: Human): string => {
    return `Hello ${person.name}, you are ${person.age}, you are a ${person.gender}`;
};

console.log(sayHi(person));

export {};
  1. Human이라는 interface로 각 인수에 대해 타입을 지정해준다.
  2. Object를 타입에 맞게 선언한다.
  3. 함수에 Object를 전달하고 타입은 interface로 지정한다.
  4. 각 인자를 꺼낼 때는 json을 출력하듯이 똑같이 person.name과 같이 사용한다.

타입스크립트에만 있는 interface의 개념에 대해 알아보았다.

interface는 문제가 일어나는 것을 막기 위해 자바스크립트로 컴파일 되지 않는다.

이 때, 자바스크립트에 넣기 위해 사용되는 것이 class로 다음 포스트에서 알아본다.

728x90