JavaScript Quiz .correct { color: green; } .incorrect { color: red; } button { background-color: #4CAF50; border: none; color: white; padding: 10px 20px; text-align: center; text-decoration: none; display: inline-block; font-size: 16px; margin: 15px 0; cursor: pointer; border-radius: 5px; transition: background-color 0.3s ease; } button:hover { background-color: #45a049; } button:disabled { background-color: #cccccc; cursor: not-allowed; opacity: 0.6; } pre { background-color: #f8f9fa; padding: 10px; border-radius: 5px; border: 1px solid #ddd; font-family: Consolas, monospace; font-size: 14px; overflow-x: auto; } .explanation { margin-top: 10px; font-size: 14px; color: #333; } 1. Aşağıdaki program çıktı olarak ne verir? var num = 50; function logNumber() { var num = 100; console.log(num); } logNumber(); 50 100 undefined ReferenceError 2. Aşağıdaki program çıktı olarak ne verir? var num = 50; function logNumber() { console.log(num); var num = 100; } logNumber(); 50 100 undefined ReferenceError 3. Aşağıdaki program çıktı olarak ne verir? (function() { var x = y = 200; })(); console.log('y: ', y); console.log('x: ', x); "y: 200", ReferenceError ReferenceError, ReferenceError "y: 200", "x: undefined" "y: 200", ReferenceError 4. Aşağıdaki program çıktı olarak ne verir? const list1 = [1, 2, 3, 4, 5]; const list2 = list1; list1.push(6, 7, 8); console.log(list2); [1, 2, 3, 4, 5] [6, 7, 8] [1, 2, 3, 4, 5, 6, 7, 8] undefined 5. Aşağıdaki program çıktı olarak ne verir? console.log([10, 20, 30, 40, 50].indexOf(30)); console.log([{ name: 'Pam' }, { name: 'Kent' }].indexOf({ name: 'Kent' })); console.log('hello world'.indexOf('o')); console.log([[1], [2], [3], [4]].indexOf([2])); 2, -1, 4, -1 2, -1, 4, 1 2, -1, 4, 4 2, 1, 4, -1 6. Aşağıdaki program çıktı olarak ne verir? console.log(900.9 === 300.3 * 3); true false NaN undefined 7. Aşağıdaki program çıktı olarak ne verir? const a = {}; const b = { name: "b" }; const c = { name: "c" }; a[b] = 250; a[c] = 500; console.log(a[b]); 250 500 undefined NaN 8. Aşağıdaki program çıktı olarak ne verir? var x = 10; function y() { x = 100; return; function x() {} } y(); console.log(x); 10 100 undefined ReferenceError 9. Aşağıdaki program çıktı olarak ne verir? const user1 = { name: 'Jordan', age: 28 }; const user2 = { name: 'Jordan', age: 28 }; console.log(user1 == user2); console.log(user1 === user2); true, true false, true true, false false, false 10. Aşağıdaki program çıktı olarak ne verir? function logNumbers() { console.log(1); setTimeout(function() { console.log(2); }, 1000); setTimeout(function() { console.log(3); }, 0); console.log(4); } logNumbers(); 1, 2, 3, 4 1, 4, 3, 2 1, 3, 4, 2 4, 3, 1, 2 Testi Bitir function submitQuiz() { const correctAnswers = { question1: 'b', question2: 'c', question3: 'a', question4: 'c', question5: 'a', question6: 'b', question7: 'b', question8: 'a', question9: 'd', question10: 'b', }; const explanations = { question1: "Fonksiyon içinde tanımlanan yerel `num` değişkeni konsola yazdırılır.", question2: "`num` hoisting nedeniyle `undefined` olur.", question3: "`y` global değişkendir, `x` ise tanımlı değildir.", question4: "`list1` ve `list2` aynı referansa sahiptir.", question5: "Sadece primitive veri türleri için tam eşleşme yapılır.", question6: "`300.3 * 3` yuvarlama hatası nedeniyle 900.9'a eşit değildir.", question7: "Nesne anahtarları `[object Object]` olarak kaydedilir ve `a[c]` son değeri alır.", question8: "Fonksiyon içindeki `x` tanımı hoisting ile yukarı taşınır, global `x` etkilenmez.", question9: "İki nesne referansı farklıdır, bu yüzden eşitlik yoktur.", question10: "Asenkron yapı nedeniyle `1, 4, 3, 2` sırasıyla yazdırılır.", }; let correctCount = 0; const labels = document.querySelectorAll('form#quizForm label'); labels.forEach(label => label.classList.remove('correct', 'incorrect')); Object.keys(correctAnswers).forEach(question => { const userAnswer = document.querySelector(`input[name="${question}"]:checked`); const explanationDiv = document.getElementById(`explanation${question.replace('question', '')}`); const correctOption = document.querySelector(`input[name="${question}"][value="${correctAnswers[question]}"]`); if (userAnswer) { if (userAnswer.value === correctAnswers[question]) { correctCount++; userAnswer.parentElement.classList.add('correct'); } else { userAnswer.parentElement.classList.add('incorrect'); } } // Doğru cevabı yeşil göster if (correctOption) { correctOption.parentElement.classList.add('correct'); } // Cevap açıklamasını ekle explanationDiv.innerHTML = `Açıklama: ${explanations[question]}`; }); const resultsDiv = document.createElement('div'); resultsDiv.innerHTML = ` Test Sonuçları: Doğru Cevaplar: ${correctCount} Yanlış Cevaplar: ${Object.keys(correctAnswers).length - correctCount} `; document.getElementById('quiz').appendChild(resultsDiv); document.getElementById('submitButton').disabled = true; }