24 OOP - Import and Export in TypeScript
📦 TypeScript Essentials #24 Import & Export: Modular Code Made Easy
In this episode, we explore how to use import and export in TypeScript to build modular, reusable code across files and components. Whether you're organizing utility functions, sharing interfaces, or structuring automation frameworks, mastering module syntax is essential for scalable development.
🎯 What You’ll Learn:
📤 Exporting Code from a Module
→ Named exports:
export const greet = (name: string) = `Hello, ${name}`;
export interface User { name: string; age: number; }
→ Default exports:
export default function log(message: string) { console.log(message); }
📥 Importing Code into Another File
→ Named imports:
import { greet, User } from './utils';
→ Default imports:
import log from './logger';
🧠 Renaming Imports & Exports
→ Use as to alias names:
import { greet as sayHello } from './utils';
export { User as AppUser };
🔄 Re-exporting Modules (Barrel Files)
→ Combine exports for cleaner imports:
export * from './user';
export * from './auth';
🛠️ Best Practices
→ Use default exports for single-purpose modules
→ Use named exports for shared utilities and types
→ Organize modules by domain or feature for clarity
🧪 Real-World Use Cases
Sharing interfaces across test components
Centralizing utility functions for automation
Structuring reusable services and configs
Creating barrel files for simplified imports
#typescript #ImportExport #Modules #TSBasics #FrontendDev #AutomationTesting #SDET #PlaywrightQA #TypeScriptTutorial #QAEngineering