github: https://github.com/Jessie-jzn
웹사이트: https://www.jessieontheroad.com/
1. 정적 유형 검사
TypeScript의 핵심 장점은 런타임이 아닌 컴파일 단계에서 일반적인 오류를 포착하는 데 도움이 되는 정적 유형 검사입니다. 이를 통해 코드 신뢰성과 안정성이 향상됩니다.
2. 향상된 코드 편집 경험
TypeScript의 유형 시스템은 편집기에서 보다 정확한 코드 완성, 리팩토링, 탐색 및 문서화 기능을 지원하여 개발 효율성을 크게 향상시킵니다.
3. 향상된 코드 유지 관리
유형 선언을 사용하면 코드 의도와 구조를 더 쉽게 이해할 수 있으며 이는 팀 개발 환경에 특히 유용합니다.
4. 고급 언어 기능
TypeScript는 인터페이스, 열거형, 제네릭 등 JavaScript에 없는 고급 기능을 지원하여 보다 구조화되고 확장 가능한 코드 개발을 촉진합니다.
5. 더 나은 도구 지원
TypeScript는 생성된 JavaScript 코드를 최적화하기 위한 다양한 컴파일러 옵션을 제공하고 TypeScript를 호환되는 JavaScript로 컴파일하여 다양한 JS 환경을 지원합니다.
타입스크립트 | 자바스크립트 | |
---|---|---|
유형 시스템 | 컴파일 시간 유형 검사를 통한 정적 유형 지정. 변수, 함수 매개변수, 반환값에 대한 유형을 지정할 수 있습니다. | 런타임 유형 검사를 통한 동적 유형 지정으로 유형 관련 런타임 오류가 발생할 수 있습니다. |
유형 주석 | 유형을 명시적으로 정의하기 위한 유형 주석을 지원합니다. 예를 들어, 이름을 지정하십시오: string = "Alice"; | 유형 주석이 없습니다. 유형은 런타임에 결정됩니다. |
편집 | JavaScript로 컴파일해야 합니다. TypeScript 컴파일러는 유형 오류를 확인하고 동등한 JavaScript 코드를 생성합니다. | 컴파일 단계 없이 브라우저나 Node.js에서 직접 실행됩니다. |
객체 지향 프로그래밍 | 클래스, 인터페이스, 추상 클래스, 액세스 한정자와 같은 더욱 풍부한 OOP 기능. | 프로토타입 기반 상속을 갖춘 기본 OOP 기능. |
고급 기능 | 모든 ES6 및 ES7 기능과 함께 제네릭, 열거형, 데코레이터와 같은 추가 기능이 포함됩니다. | ES6 이상 표준을 지원하지만 TypeScript에서 제공하는 일부 고급 기능이 부족합니다. |
제네릭을 사용하면 유형 안전성을 유지하면서 함수, 클래스 및 인터페이스가 모든 유형에서 작동할 수 있습니다.
예:
function identity(arg: T): T { return arg; } const numberIdentity = identity (42); const stringIdentity = identity ("Hello");
이 예에서 ID 함수는 일반
let anyVar: any; let unknownVar: unknown; anyVar = 5; anyVar.toUpperCase(); // No compile-time error, but might cause runtime error unknownVar = "Hello"; if (typeof unknownVar === "string") { unknownVar.toUpperCase(); // Type check ensures safety }
const obj = { name: "John" }; obj.name = "Doe"; // Allowed interface User { readonly id: number; name: string; } const user: User = { id: 1, name: "John" }; user.name = "Doe"; // Allowed user.id = 2; // Error, `id` is readonly
데코레이터는 메타데이터를 추가하거나 클래스, 메서드, 속성 또는 매개변수를 수정할 수 있는 특별한 TypeScript 기능입니다.
유형:
예:
function sealed(constructor: Function) { Object.seal(constructor); Object.seal(constructor.prototype); } @sealed class Greeter { greeting: string; constructor(message: string) { this.greeting = message; } greet() { return `Hello, ${this.greeting}`; } }
function logMethod(target: any, propertyName: string, descriptor: PropertyDescriptor) { const originalMethod = descriptor.value; descriptor.value = function (...args: any[]) { console.log(`Method ${propertyName} called with args: ${JSON.stringify(args)}`); return originalMethod.apply(this, args); }; } class Calculator { @logMethod add(a: number, b: number): number { return a b; } }
용법:
데코레이터는 tsconfig.json에서 ExperimentDecorators를 true로 설정하여 활성화됩니다.
인터페이스 및 유형은 둘 다 객체 유형을 정의하는 데 사용되지만 몇 가지 차이점이 있습니다.
인터페이스 | 유형 | |
---|---|---|
기본 사용법 | 속성 및 메서드를 포함하여 개체의 모양을 정의합니다. | 기본 유형, 객체 유형, 공용체 유형, 교차 유형 등을 정의합니다. |
확대 | 선언 병합을 지원합니다. 동일한 인터페이스의 여러 선언은 자동으로 병합됩니다. | 선언 병합을 지원하지 않습니다. |
합집합 및 교차점 유형 | 지원되지 않습니다. | 통합 지원(` |
기본 유형 별칭 | 지원되지 않습니다. | 앨리어싱 기본 유형을 지원합니다. |
매핑된 유형 | 지원되지 않습니다. | 매핑된 유형을 지원합니다. |
클래스 구현 | 구현물을 사용한 클래스 구현을 지원합니다. | 직접 클래스 구현을 지원하지 않습니다. |
이러한 질문과 답변은 기본 개념과 실제 사용법을 다루면서 TypeScript 인터뷰를 준비하는 데 도움이 됩니다.
부인 성명: 제공된 모든 리소스는 부분적으로 인터넷에서 가져온 것입니다. 귀하의 저작권이나 기타 권리 및 이익이 침해된 경우 자세한 이유를 설명하고 저작권 또는 권리 및 이익에 대한 증거를 제공한 후 이메일([email protected])로 보내주십시오. 최대한 빨리 처리해 드리겠습니다.
Copyright© 2022 湘ICP备2022001581号-3