Filtreleme
- TypeScript kursu
- Başlangıç
- Ders 79/89
- 5 dk
Duruma göre görev filtrelemeyi öğrenirsin.
filterByStatus fonksiyonu
filterByStatus, görevleri durumlarına göre süzer. filter metodu, koşula uyan öğeleri içeren yeni bir dizi döndürür; orijinal dizi değişmez.
function filterByStatus(todos: Todo[], status: Status): Todo[] {
return todos.filter(t => t.status === status);
}filter sonucunu kullanmak
filter her zaman yeni bir dizi döndürür; orijinal todos değişmez. Bu yüzden sonucu yeni bir değişkene ataman gerekir.
const active = todos.filter(t => t.status === "active");
// active: Todo[] (sadece active olanlar)Bu listede yalnızca "active" durumdaki görevler yer alır.
Uygulama filterByStatus fonksiyonu yaz
Status ve Todo tanımla. addTodo, completeTodo ve listTodos fonksiyonlarını yaz. filterByStatus(todos: Todo[], status: Status): Todo[] fonksiyonu yaz: filter ile t.status === status koşuluna uyanları döndür. "Süt al" ve "Ekmek al" görevlerini ekle, birini ("1") tamamla, "active" olanları filtrele ve listele.
Başlangıç kodu
// Status ve Todo tanımla
// addTodo ve completeTodo fonksiyonlarını yaz
// filterByStatus(todos: Todo[], status: Status): Todo[] yaz
// iki 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");
completeTodo(todos, "1");
const active = filterByStatus(todos, "active");
listTodos(active);Beklenen çıktı
2: Ekmek al [active]
Soru ve cevaplar
Dersin sorularını cevaplarıyla birlikte inceleyebilirsin. Kendini denemek istersen dersi interaktif olarak çöz.
1 filter metodu ne döndürür?
- number
- void
- Yeni bir Todo[] Doğru cevap
- Tek bir Todo
Açıklama: filter, koşula uyan tüm öğeleri içeren yeni bir dizi döndürür. Orijinal dizi değişmez; sonuç yeni bir değişkene atanır.
2 filter koşulunu tamamla
return todos.filter(t => t.status === ____);return todos.filter(t => t.status === status);Açıklama: filter, parametre olarak gelen status ile karşılaştırma yapar: t.status === status. title string değil Status'ta yok, id yanlış alan, todo ise bir nesnedir.
3 Filtreleme parçaları
| Kavram | Anlamı |
|---|---|
filter |
Koşula uyanları al |
t.status === status |
Durum karşılaştırması |
Todo[] (dönüş) |
Filtrelenmiş liste |
filterByStatus |
Duruma göre filtrele |