[Web][Typescript] 타입 작성하기 - type, interface

koline·2024년 5월 9일
0

Web

목록 보기
7/10

이전 포스팅에서 작성했던 예시 중에 아래와 형식으로 타입을 정의했었다.

type User = {
	id: string | number;
	name: string;
  	nickname?: string;
  	gender?: "man" | "woman";
  	toString: () => string;
}

Typescript에서는 type Alas 키워드 말고도 interface 키워드가 있다.

interface User {
	id: string | number;
  	name: string;
  	nickname?: string;
  	gender?: "man" | "woman";
  	toString: () => string;
}

기본적인 외관은 유사하지만 Interface는 개방-폐쇄 원칙에 따라 확장에 열려있는 JavaScript 객체의 동작 방식과 비슷하게 설계되었다고 한다.

interface ExtendedUser extends User {
 	email?: string;
  	age?: number;
}

const user: ExtendedUser = {
 	id: 1,
  	name: 'test_user',
  	nickname: 'test_nickname',
  	gender: "man",
  	toString: () => {
     	return `id: ${id}, name: ${name}`; 
    },
  	email: 'test@test.com',
  	age: 5
}

이렇게 객체지향 프로그래밍의 원칙을 더 따르도록 설계되었다.

type Alas을 사용한다면 확장이 불가능한 것은 아니다.

type ExtendedUser = {
 	email?: string;
  	age?: number;
}

const user: User & ExtendedUser = {
 	id: 1,
  	name: 'test_user',
  	nickname: 'test_nickname',
  	gender: "man",
  	toString: () => {
     	return `id: ${id}, name: ${name}`; 
    },
  	email: 'test@test.com',
  	age: 5
}

위와 같이 확장 비슷하게 사용할 수는 있긴하다.

다른 차이로는 Interface는 중복선언이 가능하다.

interface Person {
 	name: string;
}

interface Person {
 	age: number; 
}

// type Alas는 중복 선언이 안된다.
cosnt person: Person = {
  	name: 'test',
  	age: 3
}

즉, InterfaceType Alias 처럼 객체의 Type을 제약하는 목적으로도 사용할 수 있을 뿐 아니라, 일반적인 객체지향언어의 interface의 특성또한 제공한다.

그런 이유로 일반적으로는 Interface의 사용이 권장된다.

profile
개발공부를해보자

0개의 댓글

관련 채용 정보