반응형
중복되는 타입을 재사용하고 싶을 때
아래코드에서 People 타입과 Creature 타입의 species, age 속성이 중복되는것을 볼 수 있다.
interface People {
species: string;
age: number;
}
interface Creature {
species: string;
age: number;
numOfFoot: number; //발의 개수
}
let june: People = { species: "human", age: 28 };
let 돌돌이: Creature = { species: "dog", age: 3, numOfFoot: 4 };
inferface로 작성하는 경우
위코드에서 species와 age가 겹친다. 그래서 이를 extends를 사용하여 재사용 할 수 있다.
interface People {
species: string;
age: number;
}
interface Creature extends People {
numOfFoot: number; //발의 개수
}
let june: People = { species: "human", age: 28 };
let 돌돌이: Creature = { species: "dog", age: 3, numOfFoot: 4 };
index.html의 콘솔창에서도 아래와 같이 확인할 수 있다.
type alias로 작성하는 경우
type alias로 작성하는 경우에도 & 를 사용하여 아래처럼 재사용 할 수 있다.
type People ={
species: string;
age: number;
}
type Creature = People&{numOfFoot:number}
let june: People = { species: "human", age: 28 };
let 돌돌이: Creature = { species: "dog", age: 3, numOfFoot: 4 };
그런데 type alias는 중복선언이 되지 않는다.
interface의 경우엔 중복선언을 하면 그냥 합쳐진다.
차이점
- type alias는 엄격하기 때문에 중복선언을 허용하지 않는다.
- 하지만 interface는 type alias보다는 유연하여 중복선언을 하였을때 그냥 합친다.
이러한 이유 때문에 유지보수를 생각하거나 남들과 공유하는 코드를 작성할때는 Interface가 더 편하다고 한다.
number,string같은건 type alias로 선언하고, 객체는 interface로 작성하는것이 좋을것같다.
반응형
'개발 > TypeScript' 카테고리의 다른 글
typeof로 object를 구분할 수 없을때 narrowing 하는 방법 : IN 연산자 (0) | 2022.01.19 |
---|---|
타입스크립트 : rest파라미터의 타입 (0) | 2022.01.18 |
타입스크립트에서 DOM 사용하기 (0) | 2022.01.15 |
타입스크립트 타입 별칭 (Type Aliases) (0) | 2022.01.14 |
Typescript narrowing과 assertion (0) | 2022.01.14 |