[TS] 인터페이스(interface) 사용방법

type Score = 'A' | 'B' | 'C' | 'D' ;

interface User {
  name : string;
  age : number;
  gender? : string;
  readonly birthYear : number;
  [ grade:number ] : Score; 
}

let user: User= {
  name: 'aaa',
  age : 30,
  gender : 'female',
  birthYear : 1990,
  1 : 'A',
  2 : 'C'
};

user.gender = "male"
user.birthYear = 1987; //(error) readonly 여서 변경 불가

 

Interface 로 함수 정의 

interface Add{
  (num1:number, number2:number):number;
}

const add :Add = function(x, y){
  return x + y;
}

add(10, '20') // number가 아니여서 에러
add(10,20) //30

interface IsAudlt {
  (age: number):boolean;
}

const a: IsAudlt = function(x){
  return x > 19 ;
}

a(30) // true​

 

Interface 로 클래스 정의 및 확장

//Implements && extend

interface Car{
  color: string;
  wheels: number;
  start(): void;
}

interface Benz extends Car {
  door : number;
  stop() :void;
}

class Bmw implements Car{
  color;
  wheels = 4;
  constructor(c: string){
    this.color = c;
  }
  start(){
    console.log('go..')
  }
}

const b = new Bmw('blue');
b.start()

const benz :Benz = {
  door: 5,
  stop(){
    console.log('stop...');
  },
  color: 'green',
  wheels: 4,
  start(){
    console.log('go..')
  }
}

 

여러 Interface 로 확장

interface Car{
  color: string;
  wheels: number;
  start(): void;
}
interface Toy{
  name: string;
}

interface ToyCar extends Car, Toy {
  price: number;
}

 

 

참고한 강좌 : https://www.youtube.com/watch?v=prfgfj03_VA&list=PLZKTXPmaJk8KhKQ_BILr1JKCJbR0EGlx0&index=3