>  기사  >  웹 프론트엔드  >  TypeScript를 사용하여 JavaScript에서 정적 유형 검사

TypeScript를 사용하여 JavaScript에서 정적 유형 검사

PHPz
PHPz앞으로
2023-09-09 22:57:11692검색

使用 TypeScript 在 JavaScript 中进行静态类型检查

JavaScript는 유연성과 동적 특성으로 잘 알려진 인기 있는 프로그래밍 언어입니다. 그러나 이러한 유연성으로 인해 대규모 애플리케이션에서 예상치 못한 버그나 버그가 발생할 수 있습니다. 이 문제를 해결하기 위해 정적 유형 검사 기능을 제공하는 JavaScript의 상위 집합으로 TypeScript가 도입되었습니다. 이 문서에서는 시작하는 데 필요한 코드 예제 및 지침과 함께 TypeScript를 사용하여 JavaScript의 정적 유형 검사의 기본 사항을 살펴보겠습니다.

정적 유형 검사란 무엇인가요?

정적 유형 검사는 런타임이 아닌 컴파일 타임에 유형을 변수, 함수 매개변수 및 함수 반환 값과 연결하는 프로세스입니다. 이를 통해 컴파일러는 코드를 실행하기 전에 유형 오류를 감지할 수 있으므로 런타임 오류 가능성이 줄어들고 코드 품질이 향상됩니다.

TypeScript: JavaScript에 정적 타이핑 가져오기

TypeScript는 JavaScript 구문을 확장하여 정적 타이핑을 지원합니다. 개발자가 유형을 명시적으로 정의할 수 있는 새로운 구문과 구문이 도입되었습니다. TypeScript를 사용하면 개발 중에 유형 오류를 포착하고, 더 나은 코드 편집기 지원을 활용하고, 전반적인 코드 유지 관리성을 향상시킬 수 있습니다.

타입스크립트 설치

TypeScript를 사용하려면 시스템에 Node.js와 npm(노드 패키지 관리자)이 설치되어 있어야 합니다.

다음 명령을 사용하여 TypeScript를 전역적으로 설치할 수 있습니다. -

으아악

TypeScript를 설치한 후 tsc 명령을 사용하여 TypeScript 코드를 JavaScript로 컴파일할 수 있습니다.

유형을 사용하여 변수 선언

TypeScript에서는 :type 구문을 사용하여 변수 유형을 명시적으로 선언할 수 있습니다.

문자열 유형의 변수 메시지를 선언하려는 예를 고려해 보겠습니다.

으아악

지침

이 코드 조각에서는 :string 구문을 사용하여 message 변수를 문자열로 선언합니다. 컴파일러는 문자열 값만 변수에 할당할 수 있도록 강제합니다.

출력

이 코드의 출력은 -

입니다. 으아악

유형을 사용한 함수 선언

TypeScript를 사용하면 함수 매개변수 유형과 반환 값을 정의할 수 있습니다.

두 개의 숫자를 더하는 간단한 함수의 예를 살펴보겠습니다 -

으아악

지침

이 코드에서 addNumbers 함수는 숫자 유형의 두 매개변수를 받아들이고 숫자 유형의 값을 반환합니다. 변수 num1, num2 및 result는 명시적으로 숫자 형식으로 지정됩니다.

출력

이 코드의 출력은 -

입니다. 으아악

유형 추론

TypeScript에는 할당에 따라 변수 유형을 자동으로 추론할 수 있는 강력한 유형 추론 메커니즘이 있습니다.

으아악

이 코드에서는 나이와 이름의 유형을 명시적으로 선언하지 않습니다. 그러나 TypeScript는 할당된 값을 기반으로 유형을 추론합니다.

인터페이스 및 유형 주석

TypeScript는 사용자 정의 유형을 정의하기 위한 인터페이스를 제공합니다. 인터페이스는 속성의 이름과 유형을 포함하여 개체의 구조를 정의합니다. 사용자 개체에 대한 인터페이스를 정의하는 예를 살펴보겠습니다.

으아악

지침

이 코드에서는 id, name, email이라는 세 가지 속성을 가진 User라는 인터페이스를 정의합니다. 그런 다음 User 유형의 변수 user를 선언하고 인터페이스 구조를 따르는 개체를 할당합니다.

출력

이 코드의 출력은 -

입니다. 으아악

유니온형

아래 표시된 코드를 고려해보세요.

으아악

지침

이 예에서 displayResult 함수가 사용하는 인수는 문자열 또는 숫자일 수 있습니다. 이는 함수 시그니처에 공용체 유형(String | Number)을 사용하여 달성됩니다.

별칭 입력

으아악

지침

이 예에서는 x 및 y 속성이 있는 객체에 대한 별칭 Point 유형을 정의합니다. 계산 거리 함수는 두 개의 Point 개체를 매개 변수로 사용하고 피타고라스 정리를 사용하여 두 개체 사이의 거리를 계산합니다.

출력

으아악

결론

정적 유형 검사에 TypeScript를 사용하면 유형 오류 조기 발견, 향상된 코드 편집기 지원, 향상된 코드 유지 관리 등 JavaScript 개발에 많은 이점을 얻을 수 있습니다. TypeScript를 채택함으로써 개발자는 JavaScript의 유연성과 동적 특성을 즐기면서 더욱 안전하고 안정적인 코드를 작성할 수 있습니다.

이 기사에서는 변수 선언, 함수 선언, 유형 추론, 인터페이스, 공용체 유형 및 유형 별칭을 포함하여 TypeScript를 사용하여 JavaScript의 정적 유형 검사의 기본 사항을 살펴보았습니다. 이러한 지식을 바탕으로 이제 TypeScript를 사용하여 강력하고 확장 가능한 JavaScript 애플리케이션 구축을 시작할 수 있습니다.

위 내용은 TypeScript를 사용하여 JavaScript에서 정적 유형 검사의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
이 기사는 tutorialspoint.com에서 복제됩니다. 침해가 있는 경우 admin@php.cn으로 문의하시기 바랍니다. 삭제