[Nestjs] 2-3. Typescript와 인터페이스

오늘 TypeScript에서 유용하게 사용되는 interface라는 기능에 대해 알아보도록 하겠습니다. 인터페이스는 상호 간에 정의한 약속 혹은 규칙을 말합니다. 우리가 공부하는 nestjs의 Typescript에서의 interface는 객체의 속성, 함수의 매개변수, 클래스 등의 타입을 정의한 규칙이라고 보면 됩니다. 인터페이스를 간단히 예제로 살펴보면 아래와 같습니다. 

 

interface myAge{

  age: number;
  
}


function getAge(obj: myAge){

  console.log(obj.age)
  
}
 
 let person= {name: "seungwon", age: 26}
 
 getAge(person);//인터페이스에 정의된 속성, 타입의 조건만 만족하면 객체의 속성 갯수가 더 많아도 상관없음

 

위의 코드를 자세히 보면 getAge()에 넣은 인자의 개수와 person 객체 안에 든 변수의 개수가 다른 것을 관찰할 수 있습니다. 인터페이스의 속성 갯수와 인자로 받는 객체의 속성 갯수를 일치시키지 않아도 상관없습니다. 

 

 

인터페이스에서 읽기 전용 속성

인터페이스로 객체를 선언하고 수정하려고 하면 아래와 같은 오류가 발생합니다.

interface Person{
          readonly name: string;


}

let me: Person= {

       name:"seungwon"

}


me.name="leeseungwon" //error 발생

 

인터페이스에서 옵셔널 연산자와 타입 추론 무시

"?"를 사용하여 선택적으로 값을 받을 수도 있습니다. 

interface Person{
          name?: string
}

function getName(person: Person){
          //원하는 내용 입력
}

getName({nama: "seungwon"})// error 발생

getName({nama:"seungwon"} as Person);// 타입추론을 무시할 수 있음

 

만약 인터페이스에서 정의하지 않은 속성들을 추가로 사용하고 싶을 때는 아래와 같이 선언해주면 됩니다. 

 

interface Person{
       name?: string;
       [propName: string]: any
}

 

함수의 타입

인터페이스는 함수의 타입을 정의할 때에도 사용할 수 있습니다. 함수의 인자의 타입과 반환 값을 설정할 수 있습니다. 

var person: User = {
 age: 30,
 name: 'aa'
}

function getUser(user: User) {
 console.log(user);
}

혹은 아래와 같이 할 수도 있습니다. 

interface Person{
    (name: string, age: number): boolean
}

let whoYouAre: Person;//함수의 매개변수의 타입과 반환 값의 타입을 선언

whoYouAre=function(myName: string, myAge: number){

     return true;
}

 

 

클래스 타입

인터페이스에서 사용한 변수의 타입에 맞게 설정해야 사용할 수 있습니다. 

interface Person{
    name: string;
    getName(myName: string): void;
}


class me implements Person{

    constructor(){
    
    }
    
    name: string= "optimusLee";
    
    getName(a: string){
       
       this.name=a;
       
    }
    
    
}

 

 

인터페이스 확장

interface의 속성이 겹칠 경우, 속성을 추가하여 사용할 수 있습니다.

interface Person{
   name: string;
} 

interface Developer extends Person{// 인터페이스 확장
         language: string;
}

let coder= {} as Developer;

coder.name="optimus"
coder.language="typeScript"