[TypeScript] interface / Type Aliases(타입 별칭)

interface

-인터페이스는 상호 간에 정의한 약속 혹은 규칙을 의미한다

- 타입스크립트에서의 인터페이스는 보통 다음과 같은 범주에 대해 약속을 정의할 수 있다.

• 객체의 스펙(속성과 속성의 타입)
• 함수의 파라미터
• 함수의 스펙(파라미터, 반환 타입 등)
• 배열과 객체를 접근하는 방식
• 클래스

interface User{
  age:number;
  name:string;
}

 

변수에 인터페이스 활용

var seho :User={
  age:33,
  name:'세호'
}

 

함수에 인터페이스 활용

function getUser(user:User){
  console.log(user)
}
const capt={
  name:"캡틴",
  age:100
}

getUser(capt);

 

함수의 스펙(구조)에 인터페이스를 활용

interface SumFunction{
  (a:number, b:number):number;
}

var sum:SumFunction;
sum=function(a:number,b:number):number{
  return a+b;
}

 

인덱싱

interface StringArray{
  [index:number]:string;
}

var arr2:StringArray=['a','b','c'];

arr2[0]=10; // 에러 발생

 

딕셔너리 패턴

interface StringRegexDicrionary{
  [key:string]:RegExp;
}

var obj2:StringRegexDicrionary={
  //sth:/abc/,
  cssFile:/\.css$/,
  jsFile:/\.js$/
}

 obj2['cssFile']='a' // 에러발생

 

인터페이스 확장

interface Person{
  name:string;
  age:number;
}

// interface Developer{
//   name:string;
//   age:number;
//   language:string;
// }
// -> 확장  :  extends 후 더해줄 interface를 입력하면 함께 포함이 되어 
//             위의 주석된 developer와 같이 표현이 된다.
interface Developer extends Person{
  language:string;
}

var captain:Developer={
  language:'ts',
  age:100,
  name:'캡틴'
}

---

 

Type Aliases (타입 별칭)

 특정타입이나 인터페이스를 참조할 수 있는 타입 변수를 의미한다. 

타입별칭은 새로운 타입 값을 하나 생성하는 것이 아니라

정의한 타입에 대해 나중에 쉽게 참고할 수 있게 이름을 부여하는것과 같다 

 

type Person={
  name:string;
  age:number;
}

var seho:Person={
name:'세호',
age:30
}

type MyString = string;
var str : MyString ='hello';

 

type vs interface

타입별칭과 인터페이스의 가장 큰 차이점은 타입의 확장가능/ 불가능이다

인터페이스는 확장이 가능하지만 타입 별칭은 확장이 불가능하다

 

좋은 소프트웨어는 언제나 확장이 용이해아 한다는 원칙에 따라

가급적 확장이 가능한 인터페이스로 사용하는 것을 권장한다.