Birleştirme
- TypeScript kursu
- Başlangıç
- Ders 80/89
- 5 dk
Tüm parçaları birleştirerek çalışan Todo CLI'yı yazarsın.
Tüm parçaları birleştir
Todo CLI dört ana fonksiyondan oluşur: addTodo (ekle), completeTodo (tamamla), filterByStatus (filtrele), listTodos (listele). Bir oturumda önce görevleri eklersin, sonra bazılarını tamamlarsın, sonra filtreleyip listelersin.
function addTodo(todos: Todo[], title: string): Todo[] { /* ... */ }
function completeTodo(todos: Todo[], id: string): void { /* ... */ }
function filterByStatus(todos: Todo[], status: Status): Todo[] { /* ... */ }
function listTodos(todos: Todo[]): void { /* ... */ }Çalışan örnek
Üç görev ekleyip birini tamamlayalım, sonra active olanları filtreleyip listeyelim. Tamamlanan görev listeden çıkmaz; yalnızca filtrelenmiş listede yer almaz.
const todos: Todo[] = [];
addTodo(todos, "Süt al");
addTodo(todos, "Ekmek al");
addTodo(todos, "Çay al");
completeTodo(todos, "1");
const active = filterByStatus(todos, "active");
listTodos(active);Uygulama Çalışan Todo CLI yaz
Status ve Todo tanımla. addTodo, completeTodo, filterByStatus ve listTodos fonksiyonlarını yaz. Üç görev ekle ("Süt al", "Ekmek al", "Çay al"), birini ("1") tamamla, "active" olanları filtrele ve listele.
Başlangıç kodu
// Status ve Todo tanımla
// addTodo, completeTodo, filterByStatus, listTodos fonksiyonlarını yaz
// üç görev ekle, birini tamamla
// "active" olanları filtrele ve listeleÖrnek çözüm
type Status = "active" | "completed";
interface Todo { id: string; title: string; status: Status; }
function addTodo(todos: Todo[], title: string): Todo[] {
const todo: Todo = { id: String(todos.length + 1), title, status: "active" };
todos.push(todo);
return todos;
}
function completeTodo(todos: Todo[], id: string): void {
const todo = todos.find(t => t.id === id);
if (todo) {
todo.status = "completed";
}
}
function filterByStatus(todos: Todo[], status: Status): Todo[] {
return todos.filter(t => t.status === status);
}
function listTodos(todos: Todo[]): void {
todos.forEach(t => console.log(t.id + ": " + t.title + " [" + t.status + "]"));
}
const todos: Todo[] = [];
addTodo(todos, "Süt al");
addTodo(todos, "Ekmek al");
addTodo(todos, "Çay al");
completeTodo(todos, "1");
const active = filterByStatus(todos, "active");
listTodos(active);Beklenen çıktı
2: Ekmek al [active] 3: Çay al [active]
Soru ve cevaplar
Dersin sorularını cevaplarıyla birlikte inceleyebilirsin. Kendini denemek istersen dersi interaktif olarak çöz.
1 Bir Todo CLI'nin temel akışı hangisidir?
- Listele → sil → ekle
- Ekle → tamamla → filtrele → listele Doğru cevap
- Filtrele → ekle → tamamla
- Tamamla → listele → ekle
Açıklama: Önce görev eklersin, sonra bazılarını tamamlarsın, sonra durumlarına göre filtreler ve listelersin. Bu sıra mantıklı bir CLI oturumudur.
2 Filtreleme çağrısını tamamla
const active = ____(todos, "active");const active = filterByStatus(todos, "active");Açıklama: Active görevleri almak için filterByStatus çağrılır. completeTodo durum değiştirir, addTodo yeni görev ekler, listTodos sadece yazdırır.
3 Birleştirme akışı
| Kavram | Anlamı |
|---|---|
addTodo |
İlk adım: ekle |
completeTodo |
İkinci adım: tamamla |
filterByStatus |
Üçüncü adım: filtrele |
listTodos |
Son adım: listele |