When to use Interface and Model in TypeScript / Angular

1. 인터페이스

• 컴파일 시간에만 존재한다.
• TypeScript 컨텍스트 내에서만 존재하는 가상 구조이다.
• 수신된 예상 데이터가 구조를 따르는지만 확인할 수 있다.

인터페이스 생성 예시

interface User {
 id: number;
 username: string;
}
// inheritance
interface UserDetails extends User {
 birthdate: Date;
 biography?: string;  // use the '?' annotation to mark this property as optionnal
}

HttpClient에서 사용 예시

getUsers() :Observable<User[]> {
 return this.http.get<User[]>(url); // no need for '.map((res: Response) => res.json())' 
}

인터페이스 모델을 서버로 보내는 예시

public Post_signUp(name:string, id:string, password:string):Observable<number>{
    let req_signup:Request_SignUp = {
      name : name,
      id : id,
      password : password
    };
    return this.httpClient.post<number>('<http://localhost:8087/api/back/user/insertUser>',req_signup);
  }

인터페이스를 사용할 때 :

• 최종 출력에 대한 추가적인 오버헤드 없이, 서버 데이터에 대한 정의만 있으면 될 때
• 동작이나 논리(생성자 초기화, 메서드) 없이 데이터만 전송하면 될 때