Typescript 객체의 색인화된 멤버에 유형을 적용하는 방법

프로그래밍 언어 TypeScript는 강력한 형식, 객체 지향 및 컴파일된 JavaScript를 기반으로 합니다. 정적 타이핑, 클래스, 인터페이스와 같은 도구를 통해 언어가 개선되어 조기 오류 감지에 도움이 되고 JavaScript를 보다 쉽게 ​​관리할 수 있습니다. TypeScript의 기능은 객체의 인덱스 멤버 유형을 적용하는 기능이며, 이 프로세스를 인덱스 서명이라고도 합니다.

인덱스 서명은 객체가 가질 수 있는 많은 속성을 설명하는 키-값 쌍의 집합입니다. 값과 키를 각각 사용하여 속성 이름의 유형과 속성 값의 유형을 지정합니다. 객체 속성의 종류를 적용하기 위해 사용자는 TypeScript의 인덱스 서명 기능을 활용할 수 있습니다.

색인 서명은 특정 개체 속성을 효과적으로 적용할 수 있지만 코드를 이해하고 유지 관리하기 어렵게 만들 수도 있습니다. 따라서 필요한 경우에만 인덱스 서명을 사용하는 것이 매우 중요합니다.

문법

으아악

위 구문에서 'objectName'은 객체의 이름이며 키는 문자열 유형이 되고 값은 문자열이 되도록 강제합니다.

예 1

이 예에는 Person과 PhoneBook이라는 두 가지 인터페이스가 있습니다. Person 인터페이스는 이름(문자열)과 나이(숫자)라는 두 가지 속성을 포함하여 개인 객체의 구조를 정의합니다. PhoneBook 인터페이스는 문자열 유형을 키로, Person 인터페이스를 값으로 사용하여 색인 서명을 정의합니다. 즉, PhoneBook 인터페이스를 구현하는 모든 객체는 키 유형이 String이고 값 유형이 Person인 속성만 가질 수 있습니다.

그런 다음 PhoneBook 유형으로 변수 PhoneBook을 정의하고 여기에 빈 개체를 할당합니다. 그런 다음 키가 이름이어야 하고 값이 Person 개체여야 하는 전화번호부에 일부 항목을 추가합니다. 마지막으로 위의 유형 외에 다른 유형의 변수를 입력하려고 하면 컴파일러에서 오류를 보고하는 것을 콘솔 로그를 통해 확인합니다.

으아악

컴파일되면 다음 JavaScript 코드가 생성됩니다 −

으아악

출력

위 코드는 다음과 같은 출력을 생성합니다.

으아악

예 2

이 예에는 이름(문자열)과 가격(숫자)이라는 두 가지 속성을 사용하여 제품 개체의 구조를 정의하는 Product 인터페이스가 있습니다. 그런 다음 숫자 유형을 키로 사용하고 Product 인터페이스를 값으로 사용하여 인덱스 서명을 나타내는 또 다른 인터페이스 ShoppingCart가 있습니다. ShoppingCart 인터페이스를 구현하는 모든 객체는 키 유형이 Number이고 값 유형이 Product인 속성만 가질 수 있습니다.

그런 다음 ShoppingCart 유형의 변수 카트를 정의하고 여기에 빈 개체를 할당합니다. 그런 다음 키가 제품 ID이고 값이 제품 개체여야 하는 일부 항목을 장바구니에 추가합니다. 항목이 장바구니에 올바르게 추가된 것을 볼 수 있습니다. 값이 Product 유형이 아니거나 제품 개체에 Product 인터페이스에 정의된 속성이 누락된 경우 오류가 발생합니다.

으아악

컴파일되면 다음 JavaScript 코드가 생성됩니다 −

으아악

출력

위 코드는 다음과 같은 출력을 생성합니다. -

으아악

이 예제에서는 인덱스 서명을 사용하여 객체의 속성 유형을 적용하는 방법을 보여줍니다. 인덱스 서명은 보다 강력하고 유지 관리 가능한 코드를 작성하는 데 도움이 되는 강력한 기능이지만 필요한 경우에만 현명하게 사용하는 것이 중요합니다.

위 내용은 Typescript 객체의 색인화된 멤버에 유형을 적용하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!