github: https://github.com/Jessie-jzn
ウェブサイト:https://www.jessieontheroad.com/
1.静的型チェック
TypeScript の主な利点は静的型チェックであり、実行時ではなくコンパイル段階で一般的なエラーを検出するのに役立ちます。これにより、コードの信頼性と安定性が向上します。
2.強化されたコード編集エクスペリエンス
TypeScript の型システムにより、エディターでのより正確なコード補完、リファクタリング、ナビゲーション、ドキュメント機能が可能になり、開発効率が大幅に向上します。
3.コードの保守性の向上
型宣言により、コードの意図と構造を理解しやすくなり、チーム開発環境では特に有益です。
4.高度な言語機能
TypeScript は、インターフェイス、列挙型、ジェネリックなど、JavaScript には存在しない高度な機能をサポートしており、より構造化されたスケーラブルなコードの開発を容易にします。
5.より良いツールサポート
TypeScript は、生成された JavaScript コードを最適化するためのさまざまなコンパイラ オプションを提供し、TypeScript を互換性のある JavaScript にコンパイルすることでさまざまな JS 環境をサポートします。
TypeScript | JavaScript | |
---|---|---|
Type System | Static typing with compile-time type checks. Types can be specified for variables, function parameters, and return values. | Dynamic typing with runtime type checks, which can lead to type-related runtime errors. |
Type Annotations | Supports type annotations to explicitly define types. E.g., let name: string = "Alice"; | No type annotations. Types are determined at runtime. |
Compilation | Requires compilation to JavaScript. TypeScript compiler checks for type errors and generates equivalent JavaScript code. | Runs directly in browsers or Node.js without a compilation step. |
Object-Oriented Programming | Richer OOP features such as classes, interfaces, abstract classes, and access modifiers. | Basic OOP features with prototype-based inheritance. |
Advanced Features | Includes all ES6 and ES7 features, plus additional features like generics, enums, and decorators. | Supports ES6 and later standards, but lacks some of the advanced features provided by TypeScript. |
제네릭을 사용하면 유형 안전성을 유지하면서 함수, 클래스 및 인터페이스가 모든 유형에서 작동할 수 있습니다.
예:
function identity<T>(arg: T): T { return arg; } const numberIdentity = identity<number>(42); const stringIdentity = identity<string>("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로 설정하여 활성화됩니다.
interface 및 type은 모두 객체 유형을 정의하는 데 사용되지만 몇 가지 차이점이 있습니다.
interface | type | |
---|---|---|
Basic Usage | Defines the shape of objects, including properties and methods. | Defines primitive types, object types, union types, intersection types, etc. |
Extension | Supports declaration merging. Multiple declarations of the same interface are automatically merged. | Does not support declaration merging. |
Union and Intersection Types | Not supported. | Supports union (` |
Primitive Type Aliases | Not supported. | Supports aliasing primitive types. |
Mapped Types | Not supported. | Supports mapped types. |
Class Implementation | Supports class implementation using implements. | Does not support direct class implementation. |
입력
以上が【面接の必需品】ommon TypeScript 面接の質問の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。