클래스를 상속하는 클래스가 있듯이, 인터페이스 또한 extends 키워드를 사용해 인터페이스를 확장 할 수 있습니다
키워드 extends
사용 예제
패턴 1
//TypeScript
//인터페이스 확장(상속)
interface UserA {
name: string
age: number
}
interface UserB extends UserA { //extends 키워드를 통해서 내용을 상속 받음
isValid: boolean
}
const heropy: UserA = {
name: 'heropy',
age: 28,
isValid:true // 에러가 나는 부분
}
const neo: UserB= {
name: 'neo',
age: 28,
isValid:true
}
✅
1. UserA 타입은 string 타입의 name과 number타입의 age를 가지고 있습니다.
2. heropy는 UserA 타입을 이용하며 선언하였기에 isValid부분에서 에러가 납니다
✅
3. UserB 타입은 UserA 타입을 상속 받아 선언 되었습니다. 추가 속성으로 isValid를 부여 해 string 타입의 name과 number타입의 age와 boolean 타입의 isValid를 가지고 있습니다.
4. neo는 Userㅠ 타입을 이용하며 선언하였기에 isValid부분에서 에러가 없습니다
패턴2
//TypeScript
//인터페이스 확장(상속)
interface FullName{
firstName: string
lastName: string
}
interface FullName{
middleName: string
lastName: number //에러가 나는 부분
}
const fullname:FullName = {
firstName:'Tomas',
middleName: 'Sean',
lastName: 'Connery',
}
💡
인터페이스는 동일한 이름으로 만드는것이 가능합니다
이를 후속 속성이라고 부릅니다
💡
이 후속 속성을 이용해 타입에 속성을 추가 합니다
1. 처음 선언에 가지고 있는 속성은 ‘firstName’, ‘lastName’
2. 두번째 선언에 가지고 있는 속성은 ‘firstName’, ‘middleName’, ‘lastName’
✅
같은 이름의 인터페이스를 이용해 또 만들면, 한번 지정된 속성은 같은 내용으로 넣어주어야 합니다.
그렇지 않으면 에러가 나게 됩니다.
위의 예시에서 lastName 속성의 타입이 처음에 선언될 때는 string이었지만 다음에 선언될 때는 number로 바뀌어서 에러가 납니다.
