Proje: Alışveriş sepeti

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

5 derslik alışveriş sepeti projesine genel bakış: ürünleri sepete ekleyip toplam tutarı hesaplayacaksın.

Proje: Alışveriş sepeti

Bu 5 derslik projede bir alışveriş sepeti uygulaması yapacaksın. Her derste sepete bir parça ekleyecek, son derste çalışan tam bir mini uygulama elinde olacak.

Şunları yapacaksın:

Ürün adları ve fiyatları için diziler tanımlamak
push ile sepete ürün eklemek
for döngüsüyle sepetteki ürünleri listelemek
Bir total değişkeniyle fiyatları toplamak

Hazırsan başlayalım.

Hangi kavramları kullanacaksın?

Bu projede daha önce öğrendiğin kavramları birleştireceksin:

const ve let ile değişken tanımlama
[] ile dizi oluşturma
push ile diziye eleman ekleme
for döngüsü ve length ile dizi üzerinde dolaşma
Toplayıcı deseni: let total = 0 başlangıcı ve += ile artırma

Hepsi önceki derslerde işlendi; burada gerçek bir amaç için birleştireceğiz.

Projenin planı

Adım adım ilerleyeceğiz:

Bu derste boş bir cart dizisiyle başlayacağız.
Sonraki derste productNames ve productPrices dizilerini tanımlayacağız.
Sonra push ile ürünleri sepete ekleyip bir for döngüsüyle listeleceğiz.
Ardından sepetteki ürünlerin fiyatlarını toplayacağız.
Son derste her şeyi birleştirip tam uygulamayı elde edeceğiz.

Her ders, bir öncekinin kodunun üzerine çıkar.

Uygulama Boş bir sepet dizisi tanımla

Bu projenin ilk adımı olarak boş bir cart dizisi tanımla ve konsola yazdır.

Örnek çözümü göster

// Sepet için boş bir dizi
const cart = [];
console.log(cart);

Kendini test et

Bir mağazada 3 ürünün adını saklamak için en uygun yapı hangisi?
- const productNames = ["Kalem", "Defter", "Silgi"]
- const product1 = "Kalem"; const product2 = "Defter"; const product3 = "Silgi"
- const products = "Kalem Defter Silgi"
- console.log("Kalem"); console.log("Defter"); console.log("Silgi")
Cevabı göster

const productNames = ["Kalem", "Defter", "Silgi"] — Doğru! Dizi, aynı türden değerleri tek isim altında toplar ve döngüyle kolayca dolaşılabilir.
Kavramları eşleştir

cart

Sepeti temsil eden dizi
push

Diziye eleman ekleyen yöntem
for

Dizi üzerinde dolaşan döngü
total

Fiyatların toplamını tutan değişken

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

Proje: Alışveriş sepeti