JavaScript
Proje sonu - Alışveriş sepeti
Sepet uygulamasını tamamlayıp eklenen ürünleri ve toplam tutarı gösterirsin.
Şimdiye kadar ne yaptık?
Önceki dört derste şunları kurduk:
- Boş bir
cart dizisi tanımladık. productNames ve productPrices dizilerini ekledik.push ile sepete iki ürün ekledik.- Bir
for döngüsüyle ürünleri listeledik. - Bir
total toplayıcıyla fiyatları topladık.
Son adım, bunları tek bir düzgün akışta birleştirmek: sepeti yazdır, döngü içinde hem listele hem topla, son olarak toplamı göster.
Tek döngüde listele ve topla
Son adımda iki ayrı döngü yerine tek bir döngü kullanacağız. Döngü her ürün için hem console.log ile bilgi yazdırsın hem de total += productPrices[cart[i]] ile fiyatı eklesin.
Böylece kod daha kısa ve anlaşılır olur. Döngüden önce bir başlık, döngüden sonra toplamı yazdırırız.
Uygulama Sepet uygulamasını tamamla
Kodu tek bir düzgün akışta birleştir. Bir console.log ile sepet başlığını yazdır, sonra tek bir for döngüsü içinde hem her ürünü console.log(productNames[cart[i]], productPrices[cart[i]]) ile listele hem de total += productPrices[cart[i]] ile fiyatı topla. Döngüden sonra toplamı yazdır.
Örnek çözümü göster
// Alışveriş sepeti uygulaması
// Ürün adları ve fiyatları
const productNames = ["Kalem", "Defter", "Silgi"];
const productPrices = [15, 30, 10];
// Sepet
const cart = [];
cart.push(0);
cart.push(2);
// Sepeti listele ve toplamı hesapla
let total = 0;
console.log("Sepet:");
for (let i = 0; i < cart.length; i++) {
console.log(productNames[cart[i]], productPrices[cart[i]]);
total += productPrices[cart[i]];
}
console.log("Toplam:", total);
Proje tamam!
Tebrikler! Beş dersin sonunda çalışan bir alışveriş sepeti uygulaman var:
- Ürünleri iki paralel diziyle tanımlar.
push ile sepete ürün ekler.- Tek bir
for döngüsüyle hem listeler hem toplar. - Sonuçta sepet içeriğini ve toplam tutarı gösterir.
Sonraki bölümlerde bu yapıyı nesnelerle ve fonksiyonlarla nasıl güçlendireceğini öğreneceksin.
Kendini test et
-
Sepet uygulamasında hangi yapı bir ürünü temsil eder?
- productNames ve productPrices dizilerinde aynı indeksteki elemanlar
- cart dizisinin ilk elemanı
- console.log çıktısındaki bir satır
- let total değişkeni
Cevabı göster
productNames ve productPrices dizilerinde aynı indeksteki elemanlar — Doğru! Bir ürünün adı ve fiyatı iki paralel dizide aynı indekste durur.
-
Sepet başlığını yazdır
const cart = [0, 2];
let total = 25;
____
console.log("Sepet:", cart.length, "ürün");
Cevabı göster
const cart = [0, 2];
let total = 25;
console.log("Toplam:", total);
console.log("Sepet:", cart.length, "ürün");
-
Proje adımlarını eşleştir
- const cart = []
- Boş sepeti tanımlar
- cart.push(0)
- Sepete ilk ürünü ekler
- for (let i = 0; ...)
- Sepette dolaşır
- total += productPrices[cart[i]]
- Fiyatı toplama ekler
Sıradaki ders: forEach ile döngü
