Frontend 개발자 - hyo.loui

νƒ€μž…μŠ€ν¬λ¦½νŠΈ - Type Alias (νƒ€μž… 별칭) λ³Έλ¬Έ

Typescript

νƒ€μž…μŠ€ν¬λ¦½νŠΈ - Type Alias (νƒ€μž… 별칭)

hyo.loui 2023. 1. 18. 10:27

🎯λͺ©μ  :

TS Type Alias (νƒ€μž… 별칭), 정리 및 볡슡

 


1. Type Alias ?

νƒ€μž…μ„ 미리 객체의 ν˜•νƒœλ‘œ μ„ μ–Έν•΄ λ‘” ν›„

ν•„μš”ν•œ κ³³μ—μ„œ 별칭을 ν˜ΈμΆœν•˜μ—¬ μ‚¬μš©ν•  수 μžˆλ‹€.

 

// Type Alias

type Hero = {
  name: string;
  power: number;
  height: number;
  gender: "남" | "μ—¬";
};

Hero λΌλŠ” νƒ€μž…μ˜ 별칭!


2. νƒ€μž… λ³„μΉ­μ˜ ν˜•νƒœ

// Type Alias

type Hero = {
  name: string;
  power: number;
  height: number;
  gender: "남" | "μ—¬";
};

3. νƒ€μž… λ³„μΉ­μ˜ 적용

const hero1: Hero = {
  name: "슈퍼맨",
  power: 100,
  height: 100,
  gender: "남",
};

 

πŸ§ͺλ‚˜μ˜ μ‹€ν—˜μ‹€

gender에 "남" ν˜Ήμ€ "μ—¬" λΌλŠ” ν…μŠ€νŠΈλ°–μ— λ“€μ–΄μ˜¬ 수 μ—†λ‹€!


4. νƒ€μž… λ³„μΉ­μ˜ 속성듀 호좜

const printHero = (hero: Hero) => {
  console.log(hero.name, hero.power, hero.gender);
};

printHero(hero1); // 슈퍼맨 100 남

 


 

 μ΅œμ’… 정리 

  1. νƒ€μž… μ–ΌλΌμ΄μ–΄μŠ€λŠ” 객체의 ν˜•νƒœλ‘œ key: value(type) κ°€ μ €μž₯λœλ‹€
  2. νƒ€μž…μ„ ν•œλ²ˆ μ •μ˜ν•˜κ³  ν•„μš”ν•œ 곳에 λ°˜λ³΅ν•΄μ„œ μ‚¬μš©ν•  수 μžˆλ‹€
  3. μž₯점: μž‘μ„±ν•΄μ•Ό ν•  μ½”λ“œ 양을 쀄일 수 있으며, μ½”λ“œκ°€ κ°„κ²°ν•˜κ³  μœ μ§€λ³΄μˆ˜κ°€ 쉽닀