front-end/TypeScript

Typescript interface

Hoon0211 2024. 2. 23. 10:41
728x90

1. interface

1. type과 유사한 기능을 가지고 있습니다.

  // type Square = { color: string, width: number }
  interface Square { color: string, width: number }

  let test: Square = { color: 'red', width: 100 }

 

2. extends 기능이 존재합니다.

  interface Student {
    name: string,
  }
  interface Teacher extends Student {
    age: number
  }

 

3. & 기호로도 가능합니다.

- & 기호쓰는 방식을 intersection이라고 부르는데 extends 와 유사하게 사용가능합니다.

interface Student {
  name :string,
}
interface Teacher {
  age :number
}

let 변수 :Student & Teacher = { name : 'kim', age : 90 }

 

- 주의! & 사용시 같은 속성에 같은 타입의 경우 문제가 없지만, 다른 타입의 경우 에러가 발생합니다.

interface Animal { 
  name :string 
} 
interface Dog { 
  name :number
} 
let 변수 :Dog & Animal = { name : '바둑이' } // 에러 발생

 

 

4. 중복선언이 가능합니다.(자동으로  extends 작동합니다.)

  interface Student {
    name: string
  }
  interface Student {
    score: number
  }

 

728x90
댓글수0