JavaScript
Proje sonu - Yapılacaklar
To-do uygulamasını tamamlayıp tüm komutları çalışır hale getirirsin.
Son iki fonksiyon
Uygulama artık görev ekliyor, listeliyor, tamamlıyor ve siliyor. Son olarak iki küçük parça ekleyeceğiz: bir görevi id ile bulan findTask ve tamamlanma durumunu tersine çeviren toggleTask.
Bu iki fonksiyon önceki derslerdeki findIndex ve filter yerine find metodunu tanıtır. Böylece uygulamayı tamamlayıp tüm komutları kullanılabilir hale getirirsin.
Durumu tersine çevirmek
Bazen bir görevi tek seferde tamamlamak yerine tersine çevirmek istersin: tamamlansa beklemede, bekliyorsa tamamlanmış yap. Bunun için ! operatörü bir boolean'ı tersine çevirir.
task.completed = !task.completed yazdığında değer true ise false, false ise true olur. Bu, bir düğmeye her basışta durumu değiştiren arayüzlerde çok kullanışlıdır.
find ve findIndex farkı
find ile findIndex benzer çalışır ama farklı şeyler döndürür. find koşula uyan ilk elemanın kendisini verir; findIndex ise onun konumunu verir.
Konumu değil de elemanı kullanacaksan find daha kısadır. Örneğin tasks.find(function (task) { return task.id === id; }) doğrudan görev nesnesini döndürür. Bulunamazsa undefined alırsın.
Uygulama Görevi bul ve durumunu çevir
findTask ve toggleTask adında iki fonksiyon tanımla. findTask, tasks.find ile id'si eşleşen görevi döndürsün. toggleTask, findTask ile görevi bulup completed değerini ! ile tersine çevirsin; görev bulunamazsa hiçbir şey yapmasın.
Örnek çözümü göster
findTask tasks.find ile eşleşeni döndürür. toggleTask önce onu bulur, sonra completed değerini tersine çevirir.
Örnek çözüm:
function findTask(id) {
return tasks.find(function (task) {
return task.id === id;
});
}
function toggleTask(id) {
const task = findTask(id);
if (task) {
task.completed = !task.completed;
}
}
Kendini test et
-
toggleTask fonksiyonunun amacı nedir?
- Görevi siler
- Tamamlanmayı tersine çevirir
- Görevi ekler
- Görevi bulur
Cevabı göster
Tamamlanmayı tersine çevirir — toggleTask, bir görevin completed değerini tersine çevirir; true ise false, false ise true yapar.
-
toggle satırını tamamla
function toggleTask(id) {
const task = findTask(id);
if (task) {
task.completed = !____;
}
}
Cevabı göster
function toggleTask(id) {
const task = findTask(id);
if (task) {
task.completed = !task.completed;
}
}
-
Metotları kullanım alanlarıyla eşleştir
- find
- İlk eşleşeni döndürür
- findIndex
- Konumu döndürür
- !
- Boolean'ı ters çevirir
Sıradaki ders: slice ve substring
