TypeScript의 유형에 대해 알아야 할 모든 것

TypeScript: JavaScript의 정적 타이핑을 위한 초보자 가이드

JavaScript의 유연성은 양날의 검입니다. 빠른 프로토타이핑과 사용 편의성을 제공하지만 동적 특성으로 인해 디버그하기 어려운 런타임 오류가 발생할 수 있습니다. JavaScript의 상위 집합인 TypeScript는 정적 타이핑을 추가하여 이 문제를 해결합니다. 이 가이드에서는 TypeScript의 유형 시스템을 소개하고 그 이점과 효과적으로 사용하는 방법을 설명합니다.

유형 이해

프로그래밍에서 유형은 변수가 보유할 수 있는 데이터의 종류를 지정합니다. JavaScript의 동적 유형 지정은 변수가 유형을 자유롭게 변경할 수 있음을 의미합니다.

<code class="language-javascript">let value = 42; // Number
value = "Hello"; // String</code>

이러한 유연성은 편리하지만 예상치 못한 문제를 일으킬 수 있습니다. TypeScript의 정적 유형 지정을 사용하려면 변수 유형을 선언해야 이러한 오류를 방지할 수 있습니다.

<code class="language-typescript">let value: number = 42;
value = "Hello"; // Error: Type 'string' is not assignable to type 'number'</code>

유형의 중요성

정적 입력은 상당한 이점을 제공합니다.

• 조기 오류 감지: 런타임이 아닌 컴파일 중에 오류를 포착합니다.
• 향상된 도구: IDE에서 향상된 자동 완성 및 리팩토링의 이점을 누리세요.
• 향상된 코드 가독성: 유형이 내장 문서 역할을 합니다.
• 확장성: 대규모 프로젝트를 보다 효율적으로 관리하세요.

기본 TypeScript 유형

핵심 TypeScript 유형을 살펴보겠습니다.

1. 숫자: 숫자 값을 나타냅니다:

   <code class="language-typescript">let age: number = 25;
   let pi: number = 3.14;</code>

2. 문자열: 텍스트:

   <code class="language-typescript">let name: string = "Alice";
   let message: string = `Hello, ${name}`;</code>

3. 부울: 참/거짓 값:

   <code class="language-typescript">let isActive: boolean = true;</code>

4. 배열: 항목 모음:

   <code class="language-typescript">let numbers: number[] = [1, 2, 3];
   let names: string[] = ["Alice", "Bob"];</code>

   또는 제네릭 사용:

   <code class="language-typescript">let values: Array<number> = [10, 20, 30];</code>

5. 튜플: 길이와 유형이 고정된 배열:

   <code class="language-typescript">let tuple: [string, number] = ["Alice", 25];</code>

6. 열거형: 명명된 상수 정의:

   <code class="language-typescript">enum Direction {
     Up,
     Down,
     Left,
     Right
   }
   let move: Direction = Direction.Up;</code>

7. 모두: 와일드카드 유형(아껴서 사용하세요!):

   <code class="language-typescript">let random: any = 42;
   random = "Hello";</code>

8. Void: 반환 값이 없는 함수의 경우:

   <code class="language-typescript">function logMessage(message: string): void {
     console.log(message);
   }</code>

9. Null 및 정의되지 않음: Null 또는 정의되지 않음을 명시적으로 나타냄:

   <code class="language-typescript">let empty: null = null;
   let notAssigned: undefined = undefined;</code>

10. Never: 절대 발생하지 않는 유형(예: 항상 오류를 발생시키는 함수):

    <code class="language-typescript"> function alwaysThrows(): never {
       throw new Error("This always throws!");
     }</code>

고급 TypeScript 유형

TypeScript는 복잡한 시나리오를 위한 고급 유형을 제공합니다.

Union 유형 :
• 변수가 여러 유형을 보유하도록 허용 : 교차 유형 : 여러 유형을 결합합니다 : let id: number | string; 유형 별칭 :
사용자 정의 유형 만들기 :
• 인터페이스 : 객체 모양 정의 : type Staff = Person & Employee; 리터럴 유형 :
변수를 특정 값으로 제한합니다
• 유형 어설 션 : 유형을 명시 적으로 지정하십시오 초보자를위한 실용적인 팁 type Point = { x: number; y: number; };
를 사용하여 기존 JavaScript 프로젝트에 TypeScript를 추가하여 시작하십시오.
• 모범 사례를 위해 컴파일러 옵션을 사용하십시오 코드베이스에 점차 유형을 소개합니다 TypeScript 지원을 위해 좋은 IDE와 같은 CODE를 활용하십시오. 오버 오스링 interface User { id: number; name: string; }
결론 TypeScript의 유형 시스템은 코드 품질과 유지 관리를 크게 향상시킵니다. 유형을 마스터 링하면보다 강력하고 확장 가능한 응용 프로그램을 작성합니다. 정적 타이핑의 힘을 받아들이고 개발 워크 플로우를 향상시킵니다!

위 내용은 TypeScript의 유형에 대해 알아야 할 모든 것의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!