CodeBlanks Logo Icon CodeBlanks

Proje sonu - Quiz

JavaScript kursu · Başlangıç · Ders 81/133

Quiz uygulamasını tamamlayıp toplam skoru gösterirsin.

Şimdiye kadar ne yaptık?

Önceki dört derste şunları kurduk:

  • Boş bir questions dizisi tanımladık.
  • Soru nesnelerini diziye ekledik.
  • for...of ile soruları gösterdik ve parseInt ile cevapları sayıya çevirdik.
  • === ile doğruyu kontrol edip score sayacını artırdık.

Son adım, uygulamayı üç soruya çıkarıp hem doğru sayısını hem de toplam soru sayısını göstermek.

Sonucu gösterme

Döngü bittiğinde score değişkeni kaç cevabın doğru olduğunu söyler. Toplam soru sayısı için questions.length'i kullanırız. İkisini yan yana yazdırmak kullanıcıya net bir sonuç verir.

Örneğin console.log("Doğru sayısı:", score) ve console.log("Toplam soru:", questions.length) çıktısı "Doğru sayısı: 2" ve "Toplam soru: 3" gibi iki satır verir.

Uygulama Quiz uygulamasını tamamla

Kodu son hâline getir. questions dizisine üçüncü bir soru nesnesi ekle. userAnswers dizisine de üçüncü bir cevap stringi koy (toplam üç eleman). Döngü sonunda hem console.log("Doğru sayısı:", score) ile doğru sayısını hem de console.log("Toplam soru:", questions.length) ile toplam soru sayısını yazdır.

Örnek çözümü göster
// Quiz sorularını tanımla
const questions = [
  { question: "Türkiye'nin başkenti?", options: ["İzmir", "Ankara", "Bursa"], answer: 1 },
  { question: "En çok yağış alan il?", options: ["Rize", "Konya", "Ankara"], answer: 0 },
  { question: "En uzun nehir?", options: ["Kızılırmak", "Fırat", "Sakarya"], answer: 0 }
];
// Kullanıcı cevapları (seçenek indeksleri string olarak)
const userAnswers = ["1", "0", "0"];
let score = 0;
let answerIndex = 0;
for (const q of questions) {
  const userAnswer = parseInt(userAnswers[answerIndex]);
  if (userAnswer === q.answer) {
    score++;
  }
  answerIndex++;
}
console.log("Doğru sayısı:", score);
console.log("Toplam soru:", questions.length);

Proje tamam!

Tebrikler! Beş dersin sonunda çalışan bir quiz uygulaması var:

  • Soruları nesne dizisi olarak tanımlar.
  • for...of ile her soruyu sırayla gösterir.
  • parseInt ile string cevapları sayıya çevirir.
  • === ile doğruyu kontrol edip score'u artırır.
  • Sonuçta doğru sayısını ve toplam soruyu gösterir.

Sonraki bölümlerde bu yapıyı fonksiyonlarla ve daha fazla nesneyle nasıl genişleteceğini öğreneceksin.

Kendini test et

  1. Quiz uygulamasında her sorunun doğru cevabını nerede saklarız?

    • Ayrı bir correctAnswers dizisinde
    • Soru nesnesinin answer özelliğinde
    • score değişkeninde
    • console.log çıktısında
    Cevabı göster

    Soru nesnesinin answer özelliğinde — Doğru! Her soru nesnesinin answer özelliği o sorunun doğru indeksini tutar.

  2. Skor mesajını tamamla

    console.log("Doğru sayısı:", ____);
    Cevabı göster
    console.log("Doğru sayısı:", score);
  3. Parçayı görevine eşleştir

    questions dizisi
    Soruları ve doğru cevapları tutar
    userAnswers dizisi
    Kullanıcının verdiği cevaplar
    for...of döngüsü
    Soruları sırayla dolaşır
    score sayacı
    Doğru sayısını biriktirir

Başlangıç bölümündeki tüm dersler