A hands-on TypeScript project demonstrating core language features through practical problem-solving - covering generics, type guards, union & intersection types, enums, OOP inheritance, async patterns and more.
This project is a focused TypeScript exercise project that tackles real-world coding problems using TypeScript's powerful type system. Each function demonstrates a specific language concept - from generics and type narrowing to class inheritance and async/await - making it an ideal reference for building type-safe, maintainable code.
Mastering TypeScript, one problem at a time.
| No. | Problem | Function / Class | Concept | Description |
|---|---|---|---|---|
| 1 | Format String | formatString() | Optional Parameters | Converts a string to uppercase by default, or lowercase when the optional toUpper flag is explicitly set to false |
| 2 | Filter by Rating | filterByRating() | Typed Object Arrays | Accepts an array of objects with title and rating properties, returns only items with a rating greater than 4 |
| 3 | Concatenate Arrays | concatenateArrays<T>() | Generics | Merges multiple arrays of any type into a single array using a generic type parameter <T> and rest parameters |
| 4 | Vehicle & Car | Vehicle → Car | OOP & Inheritance | Base Vehicle class with private members; Car extends it with an additional model property and getModel() method |
| 5 | Process Value | processValue() | Union Types & Type Guards | Accepts string | number, returns the string length for strings or doubles the value for numbers using typeof narrowing |
| 6 | Most Expensive Product | getMostExpensiveProduct() | Interfaces & Reduce | Defines a Product interface and finds the highest-priced product using .reduce(), returns null for empty arrays |
| 7 | Day Type Checker | getDayType() | Enums | Uses a Day enum with all weekdays; returns "Weekend" for Saturday/Sunday and "Weekday" for the rest |
| 8 | Async Square | squareAsync() | Async/Await & Promises | Returns a Promise<number> that resolves with the squared value after 1 second, or rejects for negative inputs |
| Technology | Version | Purpose |
|---|---|---|
| TypeScript | ES2024 | Statically typed language for JavaScript |
| Node.js | v18+ | JavaScript runtime environment |
| ts-node-dev | - | TypeScript execution with auto-restart on changes |
┌──────────────────────────────────────────────────────────┐ │ TypeScript Compiler │ │ (tsconfig.json - ES2024) │ ├──────────────────────────────────────────────────────────┤ │ │ │ src/index.ts │ │ ┌────────────────────────────────────────────────────┐ │ │ │ Utility Functions │ │ │ │ │ │ │ │ ┌──────────────┐ ┌───────────────────────────┐ │ │ │ │ │ formatString │ │ filterByRating │ │ │ │ │ │ (Overloads) │ │ (Array + Object Types) │ │ │ │ │ └──────────────┘ └───────────────────────────┘ │ │ │ │ │ │ │ │ ┌──────────────┐ ┌───────────────────────────┐ │ │ │ │ │ concatenate │ │ processValue │ │ │ │ │ │ Arrays<T> │ │ (Union + Type Guards) │ │ │ │ │ └──────────────┘ └───────────────────────────┘ │ │ │ │ │ │ │ │ ┌──────────────────────────────────────────────┐ │ │ │ │ │ getMostExpensiveProduct (Interface + Reduce)│ │ │ │ │ └──────────────────────────────────────────────┘ │ │ │ ├────────────────────────────────────────────────────┤ │ │ │ OOP Hierarchy │ │ │ │ ┌──────────────┐ │ │ │ │ │ Vehicle │◄── Base class (make, year) │ │ │ │ │ └── Car │◄── Derived class (+ model) │ │ │ │ └──────────────┘ │ │ │ ├────────────────────────────────────────────────────┤ │ │ │ Enums & Async │ │ │ │ ┌──────────────┐ ┌───────────────────────────┐ │ │ │ │ │ Day Enum │ │ squareAsync │ │ │ │ │ │ (getDayType)│ │ (Promise + setTimeout) │ │ │ │ │ └──────────────┘ └───────────────────────────┘ │ │ │ └────────────────────────────────────────────────────┘ │ │ │ │ │ ▼ │ │ dist/ (Compiled JS) │ └──────────────────────────────────────────────────────────┘
milestone-13/
│
├── package.json # Dependencies and scripts
├── tsconfig.json # TypeScript compiler configuration
│
├── src/
│ └── index.ts # All TypeScript problem solutions
│
└── dist/ # Compiled JavaScript output
| Requirement | Details |
|---|---|
| Node.js | v18 or higher recommended |
| npm | Comes bundled with Node.js |
| TypeScript | Installed as a dev dependency |
# 1. Clone the repository
git clone https://github.com/zahid-official/milestone-13-problemSolving.git
# 2. Navigate to the project directory
cd milestone-13
# 3. Install dependencies
npm install
# 4. Start the development server
npm run devThe application will compile and run via ts-node-dev with auto-restart enabled.
| Command | Description |
|---|---|
npm run dev | Run TypeScript with ts-node-dev - auto-restarts on file changes |
npm test | Run the test suite (placeholder) |
Source File (index.ts) ──► ts-node-dev watches for changes
│
┌───────────────┘
▼
TypeScript Compiler
(strict mode, ES2024)
│
┌──────────┴──────────┐
▼ ▼
Type Checking Transpilation
(Catches errors (Generates JS
at compile time) in /dist)
│ │
▼ ▼
Error Feedback ◄── Node.js Runtime
(Developer fix) (Executes output)
- Write - TypeScript functions are authored in
src/index.tswith full type annotations. - Compile -
ts-node-devtranspiles TypeScript on-the-fly with--transpile-onlyfor speed. - Execute - The compiled JavaScript runs in the Node.js runtime environment.
- Watch - File changes trigger automatic re-compilation and re-execution via
--respawn. - Validate - TypeScript's strict mode catches type errors before runtime, ensuring code correctness.
Web Developer | Tech Enthusiast
Building type-safe solutions through clean code and continuous learning
Contributions are welcome and appreciated! Here's how you can help improve this project:
# 1. Fork the repository
# 2. Create a feature branch
git checkout -b feature/your-feature-name
# 3. Make your changes and commit
git commit -m "feat: add your feature description"
# 4. Push to your fork
git push origin feature/your-feature-name
# 5. Open a Pull Request against the main branchMastering TypeScript, one problem at a time.