TypeScript - 6

박태영·2024년 5월 25일

typescript

목록 보기
6/9

1. interface

  • 타입 스크립트에 오브젝트의 형태를 알려주기 위한 키워드

type과의 차이점

1. 유니온/인터섹션 타입 사용불가

type A = {
  name:string
}

type Person = A & {
  age:number
}

const nick:Person = {
	name:"park",
  	age:30
}

type team = "red"|"blue"|"yellow";
// interface "|"를 이용한 유니온 타입 사용 ❌
//interface "&"을 이용한 인터섹션 타입 기능 사용 ❌

ℹ️interface의 extends를 이용하면 typ의 인터섹션 타입과 거의 동일한 기능을 사용할 수 있다.

interface A {
  name:string
}

interface Person extends A{
	age:number
}

const nick:Person = {
	name:"park",
  	age:30
}
  • interface가 조금더 선언 방식과 형태가 class와 가깝다

2. 클래스와 같이 사용 가능

//인터페이스 구현
interface Animal {
  name: string;
  makeSound(): void; 
}

//Dog element가 Animal 인터페이스를 구현하도록 함
class Dog implements Animal { 
  name: string;
  
  constructor(name: string) {
    this.name = name;
  }

  makeSound(): void {
    console.log("Woof! Woof!");
  }
}

const myDog = new Dog("Buddy");
console.log(myDog.name); // "Buddy"
myDog.makeSound(); // "Woof! Woof!"

// type은 class와 같이 사용을 할 수 없다.

3. 선언 병합 가능

인터페이스의 경우

interface Person { //1.Person interface 선언
  name: string;
}

interface Person { //2.Person interface의 중복 선언
  age: number;
}

const person: Person = { //3. 두 interface선언이 병합됨
  name: "John",
  age: 30
};

타입의 경우

type Person = {
  name: string;
};

type Person = {
  age: number;
};

// Error: Duplicate identifier 'Person'.
//타입은 병합 선언이 되지 않는다.
profile
어른 아이

0개의 댓글