0
0
Typescriptprogramming~10 mins

Generic repository pattern in Typescript - Step-by-Step Execution

Choose your learning style9 modes available
Concept Flow - Generic repository pattern
Define Generic Interface Repository<T>
Implement Repository Class<T>
Create Specific Repository Instance
Use Repository Methods (add, get)
Manage Data of Type T
End
The generic repository pattern defines a reusable interface and class to manage data of any type T, allowing creation and use of specific repositories for different data types.
Execution Sample
Typescript
interface Repository<T> {
  add(item: T): void;
  get(id: number): T | undefined;
}

class RepositoryImpl<T> implements Repository<T> {
  private items = new Map<number, T>();
  add(item: T) { this.items.set(this.items.size + 1, item); }
  get(id: number) { return this.items.get(id); }
}

const userRepo = new RepositoryImpl<{name: string}>();
userRepo.add({name: "Alice"});
const user = userRepo.get(1);
This code defines a generic repository interface and class, then creates a user repository to add and get a user object.
Execution Table
StepActionVariable/MethodInputState ChangeOutput
1Define interface Repository<T>Repository<T>N/AInterface readyN/A
2Implement class RepositoryImpl<T>RepositoryImpl<T>N/AClass ready with empty items MapN/A
3Create userRepo instanceuserRepoN/AuserRepo.items = empty MapN/A
4Call userRepo.addadd{name: "Alice"}items Map size=1, key=1, value={name: "Alice"}void
5Call userRepo.getget1No change{name: "Alice"}
6EndN/AN/AFinal items Map has 1 entryN/A
💡 No more actions, repository used to add and get data successfully
Variable Tracker
VariableStartAfter Step 3After Step 4After Step 5Final
userRepo.itemsundefinedempty Map {}Map {1 => {name: "Alice"}}Map {1 => {name: "Alice"}}Map {1 => {name: "Alice"}}
userundefinedundefinedundefined{name: "Alice"}{name: "Alice"}
Key Moments - 3 Insights
Why does userRepo.items start empty and then have one entry after add?
At step 3, userRepo is created with an empty Map. At step 4, add inserts the item with key 1, so the Map size becomes 1 as shown in execution_table row 4.
What type does the repository store and return?
The repository stores and returns objects of type T, which in this example is {name: string}, as seen in the generic interface and class and the userRepo instance.
Why does get return undefined if the id is not found?
The get method returns undefined if the Map has no entry for the given id, which matches the Map.get behavior and is shown in the method signature Repository<T>.get.
Visual Quiz - 3 Questions
Test your understanding
Look at the execution_table at step 4. What is the size of userRepo.items after adding the first item?
A1
B0
C2
Dundefined
💡 Hint
Check the 'State Change' column at step 4 in the execution_table where items Map size is updated.
At which step does the variable 'user' get assigned a value?
AStep 3
BStep 5
CStep 4
DStep 6
💡 Hint
Look at the variable_tracker for 'user' and see when it changes from undefined to an object.
If we call userRepo.get(2) instead of get(1), what would be the output?
AError
B{name: "Alice"}
Cundefined
Dnull
💡 Hint
Refer to the get method behavior and Map.get when key is missing, as explained in key_moments.
Concept Snapshot
Generic Repository Pattern in TypeScript:
- Define interface Repository<T> with methods like add(item: T) and get(id: number).
- Implement class RepositoryImpl<T> with a Map to store items.
- Create instances for specific types, e.g., RepositoryImpl<{name: string}>.
- Use add to store and get to retrieve items by id.
- Enables reusable data management for any type T.
Full Transcript
This visual execution traces the generic repository pattern in TypeScript. First, we define a generic interface Repository<T> with add and get methods. Then, we implement RepositoryImpl<T> using a Map to store items keyed by number. We create an instance userRepo for objects with a name property. When we add an item, the Map stores it with key 1. When we get by id 1, the stored object is returned. Variables userRepo.items and user track the Map and retrieved object states. Key moments clarify why the Map size changes and how types are used. The quiz tests understanding of Map size after add, when user is assigned, and get behavior for missing keys. This pattern helps manage data generically and reuse code for different types.