타입별칭

목차
1. 타입별칭이란?(type alias)
2. 타입별칭을 이용한 코드 단순화
3. 타입별칭 vs 인터페이스
4. 타입별칭은 언제 쓰는 것이 좋을까?
5. 퀴즈

타입별칭이란?(type alias)

• 타입에 의미를 부여해서 별도의 이름으로 부르는 것
• 해당 타입이 어떤 역할을 하는지 이름을 짓고 싶을 때 사용
• 반복되는 타입을 변수화해서 쉽게 표기하기 싶을 때 사용

예시)
type Combinable = number | string

function combine(input: Combinable){

return ~~~

}

예시2)

type MyMessage = string | number;
const longtext = (text:MyMessage) => {
  return ~~~
}
  
  var message: MyMessage = '안녕하세요.' // string

   - strng|number 타입을 MyMessage라는 타입별칭으로 정의
   - 반복되는 코드를 줄이고,
   - string|number 타입이 myMessage에 사용되는 타입이라는 의미도 부여함
   - 여러 곳에 재사용 가능

주의

type MyName = string;
type MyName = Number; // 에러 발생

코드 단순화

타입별칭 사용전
function greet(user:{name : string; age : number}){
return ~~~
}

타입별칭 사용후
type User = { name: string; age: number}

function greet(user : User){
return ~~~

}

타입별칭 vs 인터페이스

타입별칭

type User ={
 id: string;
 name:string;
}


인터페이스

interface User{
  id:string;
  name:string;
}




 

인터페이스

타입별칭

타입별칭 vs 인터페이스 2

type ID = string;
type Product = Tshirt | Shoes;
type Teacher = Person & Adult;

일반타입에 이름을 짓거나, 유니언타입, 인터섹션 타입등에도 사용이 가능
다만 이런 타입들은 인터페이스로 정의 할 수 없음

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


type Adult = {
  old: boolean;
}

type Teacher = Person & Adult;

인터페이스와 타입별칭의 정의를 함께 사용 할 수 있음

타입별칭 vs 인터페이스 3, 타입확장

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

interface Developer extends Person{
  skill:String;
}

var Joo : Developer ={
 name: '진영',
 age: 25,
 skill: '웹개발'
}

인터페이스는 extends라는 키워드를 이용해 부모 인터페이스 타입을 -> 자식 인터페이스에 상속해서 사용이 가능
but 타입 별칭은 인터섹션 타입으로 객체 타입 2개를 합쳐서 사용 할 수 있음
  

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

type Developer ={
  skill:string; 
}

var joo : Person & Developer ={
 name:'진영',
  age:25,
  skill:'웹개발'
}

타입별칭은 언제 쓰는 것이 좋을까?

공식문서
2021년 - 인터페이스 사용을 권장
2023년 - 해당 내용이 빠짐, 즉 타입 별칭으로만 타입 정의가 가능한 곳에서는 타입 별칭을 사용
백엔드와 인터페이스를 정의하는 곳에서는 인터페이스를 사용

interface Admin {
  role:string;
  department:string;
}



// 상속을 통한 인터페이스 확장, 여기서 User 인터페이스는 Admin이라는 인터페이스를 상속받았기 떄문에 id,name,role,department 속성을 모두 갖는 객체 타입으로 정의 된다.

interface User extends Admin{
 id:string;
 name:string;
}

// 여기에 skill 속성을 갖는 두번쨰 User 인터페이스를 선언이 가능하다. 
interface User{
  skill:string
}

// 최종적으로 User 인터페이스는 아래의 속성을 모두 갖는 객체 타입을 정의된다.
interface User{
  id:string;
  name:string;
  role:string;
  department:string;
  skill:string;
}

퀴즈

1. 
type YourName = number;
type YourName = string; 
에러발생 여부 -> O / X


2.

인터페이스와 타입별칭 모두 데이터 타입과 인터섹션, 유니언 타입을 정의 할 수 있다. 
ex) 
Mystinrg = string
StringOrNumber = string | number 
Admin = Person & Developer

맞으면 O / 틀리면 X 




3. 동일한 이름으로 interface를 여러번 선언하는건 불가능하다.

ex)

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

interface Person{
 address:string; 
}

var seho: Person ={
 name:'진영',
  age: 30,
  address:'광교' 
}


맞으면 O / 틀리면 X