TypeScript 5.5 introduces significant improvements to the type system and developer experience. Whether you're starting fresh or migrating an existing JavaScript project, this guide will help you leverage the latest features effectively.
Key Features in TypeScript 5.5
1. Improved Type Inference
TypeScript 5.5 features smarter inference that reduces the need for explicit type annotations:
// The type is now correctly inferred as (string | number)[]
const mixed = [1, "two", 3, "four"];
// Function return types are inferred more accurately
function processData(input: unknown) {
if (typeof input === "string") {
return input.toUpperCase(); // string
}
if (typeof input === "number") {
return input * 2; // number
}
return null;
}
// Return type: string | number | null
2. Const Type Parameters
function createConfig<const T extends Record<string, unknown>>(config: T): T {
return config;
}
// Type is exactly { apiUrl: "https://api.example.com"; timeout: 5000 }
const config = createConfig({
apiUrl: "https://api.example.com",
timeout: 5000
});
3. Decorator Metadata
function logged(target: any, context: ClassMethodDecoratorContext) {
const methodName = String(context.name);
return function (...args: any[]) {
console.log(\`Calling \${methodName} with:\`, args);
const result = target.apply(this, args);
console.log(\`\${methodName} returned:\`, result);
return result;
};
}
class Calculator {
@logged
add(a: number, b: number) {
return a + b;
}
}
Migration Strategies
Gradual Migration Approach
- Add TypeScript to your project:
npm install typescript --save-dev npx tsc --init - Configure for gradual adoption:
// tsconfig.json { "compilerOptions": { "allowJs": true, "checkJs": false, "strict": false, "noImplicitAny": false } } - Convert files incrementally: Start with utility functions and work toward complex components
- Enable strict mode gradually: Turn on one strict flag at a time
Strict Mode Flags to Enable
{
"compilerOptions": {
"strict": true, // Enable all strict checks
"noImplicitAny": true, // Error on implicit any
"strictNullChecks": true, // Null/undefined handling
"strictFunctionTypes": true, // Function type checking
"strictPropertyInitialization": true // Class property init
}
}
Common Patterns and Utilities
Type Guards
interface Dog {
bark(): void;
}
interface Cat {
meow(): void;
}
function isDog(animal: Dog | Cat): animal is Dog {
return 'bark' in animal;
}
function makeSound(animal: Dog | Cat) {
if (isDog(animal)) {
animal.bark(); // TypeScript knows it's a Dog
} else {
animal.meow(); // TypeScript knows it's a Cat
}
}
Utility Types
interface User {
id: string;
name: string;
email: string;
password: string;
}
// Create a type without sensitive fields
type PublicUser = Omit<User, 'password'>;
// Create a type with all optional fields
type PartialUser = Partial<User>;
// Create a type with all required fields
type RequiredUser = Required<PartialUser>;
TypeScript continues to evolve and improve. Stay updated with the latest features to write safer, more maintainable code.
Comments (0)
Leave a Comment
No comments yet. Be the first to share your thoughts!