> 웹 프론트엔드 > JS 튜토리얼 > 인터페이스 대신 유형을 선택하는 이유

인터페이스 대신 유형을 선택하는 이유

王林
풀어 주다: 2024-08-05 19:03:02
원래의
798명이 탐색했습니다.

Why to Choose Types Instead of Interfaces

TypeScript에서는 유형과 인터페이스 모두 객체 유형을 정의하는 데 사용됩니다. 그러나 용도와 기능이 다릅니다. 두 가지 모두 개발자가 코드를 작성할 때 변수와 객체의 유형을 제한하여 오류를 줄이고 코드 가독성을 높이는 데 도움이 됩니다.

그렇다면 Type이 왜 필요한가요? 이에 대해 논의해 보겠습니다.

유형

TypeScript에서는 유형을 사용하여 데이터의 모양을 정의할 수 있습니다. 유연하며 결합체, 교차점 등을 생성하는 데 사용할 수 있습니다.

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

type Admin = User & {
  isAdmin: boolean;
};
로그인 후 복사

인터페이스

인터페이스는 객체의 모양을 정의하는 또 다른 방법입니다. 유형보다 더 엄격하며 주로 객체 모양 및 클래스 계약을 정의하는 데 사용됩니다.

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

interface Admin extends User {
  isAdmin: boolean;
}
로그인 후 복사

내가 유형을 선호하는 이유

  • 연합

Union 유형을 사용하면 여러 유형 중 하나가 될 수 있는 유형을 정의할 수 있습니다. 이는 함수 매개변수 및 반환 유형에 유용합니다. 여기서 ID는 문자열이나 숫자일 수 있으며, 이는 공용체 유형의 강력함을 보여줍니다.

type ID = string | number;

function getUserId(id: ID): string {
  return `User ID: ${id}`;
}
로그인 후 복사
  • 문자열 리터럴

리터럴 유형을 사용하면 변수가 가질 수 있는 정확한 값을 지정할 수 있습니다. 이는 상수 또는 구성 옵션을 정의하는 데 매우 유용할 수 있습니다.

type Direction = 'north' | 'south' | 'east' | 'west';

function move(direction: Direction) {
  console.log(`Moving ${direction}`);
}

move('north');
로그인 후 복사
  • 조건부 유형

유형을 사용하면 조건부 유형을 생성할 수 있어 조건에 따라 유형을 선택할 수 있습니다

type Check<T> = T extends string ? string : number;

let result1: Check<string>; // result1 is of type string
let result2: Check<number>; // result2 is of type number
로그인 후 복사
  • 교차로

교차 유형을 사용하면 여러 유형을 하나로 결합할 수 있습니다. 이는 복잡한 유형의 구성을 만드는 데 특히 유용합니다.

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

type Employee = {
  employeeId: number;
};

type EmployeeDetails = Person & Employee;

const employee: EmployeeDetails = {
  name: 'Dev',
  age: 30,
  employeeId: 12345,
};
로그인 후 복사

유형과 인터페이스 중 하나를 선택하는 것은 궁극적으로 구체적인 사용 사례와 개인 선호도에 따라 달라집니다. 그러나 각각의 장점을 이해하면 더 많은 정보를 바탕으로 결정을 내리고 더 나은 TypeScript 코드를 작성하는 데 도움이 될 수 있습니다.

위 내용은 인터페이스 대신 유형을 선택하는 이유의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

원천:dev.to
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿