[TS] 타입 별칭

Im-possible·2025년 4월 28일

타입 별칭

- 유니언 타입 같은 복잡한 타입에 의미 있는 이름을 붙여서 변수에 저장해서 사용
- type 키워드로 선언하는 사용자 정의 타입
- JS로 컴파일 하면 제거됨
- PascalCase(대문자로 시작)를 사용하며, 명사형으로 변수 설정

기존 타입 지정(유니언 타입)

function log(msg: number | string):void {
  console.log(msg);
}

const msg2: Message = 'world';
const msg3: Message = 123

log(msg2);
log(msg3);

타입 별칭 사용

// 타입 별칭 추가
type Message = string | number;

function log(msg: Message):void {
  console.log(msg);
}

const msg2: Message = 'world';
const msg3: Message = 123;

log(msg2);
log(msg3);

타입 별칭으로 객체 타입 선언

- 객체의 속성명과 속성값의 타입 지정
- 속성 구분은 `;`를 권장한다
- 타입 별칭을 타입으로 지정한 객체는 타입 별칭에 정의된 속성명과 속성의 타입을 준수해야한다.
// 타입 별칭 생성
type User = {
  name: string;
  age: number;
};

const u1: User = {
  name: 'kim',
  age: 10,
};

const u2: User = {
  name: 'lee',
  age: '13', // 타입 에러
}

const u3: User = {
  name: 'lee',
  userAge: 20,
  // age 속성이 없기 때문에 타입 에러
}

console.log(u1.age, u1.name);

인터섹션 타입

- 타입 여러개를 하나로 합치기 위해 `&`(AND 연산자)로 연결한 타입
- 타입 별칭을 확장할 때 사용
- 기존에 쓰던 타입 별칭에서, 기존의 타입 별칭을 유지하며 또 다른 속성을 추가하고 싶을 때 사용
- 동일한 속성을 인터섹션 타입으로 추가할 때 타입이 다르면 never 타입이 되어 해당 속성은 사용 불가
// 기존 타입 별칭
type TodoRegist = {
  title: string;
  content: string;
};

// TodoRegist 타입을 확장
type TodoInfo = TodoRegist & {
  id: number;
  done: boolean;
};

const todo1: TodoRegist = {
  title: "타입스크립트";
  content: "기존의 속성 사용";
};

const todo2: TodoInfo = {
  id: 1,
  title: "인터섹션 타입",
  content: "기존 속성과 확장된 속성 둘 다 사용 가능",
  done: false,
};

0개의 댓글