Storage olayları

Aynı sekmede açık diğer pencerelerde storage değişince haberdar olmayı öğrenirsin.

storage olayı

storage olayı, aynı sitenin başka bir sekmesinde localStorage değiştiğinde tetiklenir. Böylece iki sekme arasında anında haberdar olabilirsin.

window.addEventListener('storage', handler);

Önemli nokta: olay aynı sekmede değil, yalnızca diğer sekmelerde tetiklenir. Yani setItem yaptığın sekme bu olayı almaz; diğer açık sekmeler alır.

Olay nesnesinin özellikleri

Olay tetiklendiğinde, işleyici fonksiyon bir olay nesnesi alır. Bu nesne üç yararlı özellik taşır: key değişen anahtarın adını, newValue yeni değeri, oldValue ise eski değeri verir.

window.addEventListener('storage', (event) => {
  console.log(event.key, event.newValue);
});

Bu özelliklerle neyin değiştiğini ve önceki değerinin ne olduğunu öğrenebilirsin.

Uygulama storage olayını dinle ve bilgileri yaz

window.addEventListener ile 'storage' olayını dinle. Olay tetiklendiğinde event.key ve event.newValue değerlerini console.log ile yaz.

Örnek çözümü göster

window.addEventListener('storage', (event) => {
  console.log(event.key, event.newValue);
});

Kendini test et

storage olayı ne zaman tetiklenir?
```
// Sekme A:
localStorage.setItem('x', '1');
// Sekme B: ?
```
- Aynı sitenin başka bir sekmesinde localStorage değişince
- Aynı sekmede setItem yapınca
- Sayfa yüklendiğinde
- Internet kesilince
Cevabı göster

Aynı sitenin başka bir sekmesinde localStorage değişince — Doğru! storage olayı başka sekmede değişince tetiklenir.

storage olayını dinle

window.addEventListener('storage', ____ => { console.log(event.key); });

Cevabı göster

window.addEventListener('storage', (event) => { console.log(event.key); });

Olay özelliklerini eşleştir

event.key

Değişen anahtarın adı
event.newValue

Yeni değer
event.oldValue

Eski değer
Aynı sekmede setItem yaparsan storage olayı tetiklenir mi?
```
// Tek sekme:
localStorage.setItem('x', '1');
// storage olayı ?
```
- Evet, hemen tetiklenir
- Yalnızca sayfa yenilenince
- Yalnızca removeItem için
- Hayır, yalnızca diğer sekmelerde tetiklenir
Cevabı göster

Hayır, yalnızca diğer sekmelerde tetiklenir — Doğru! Aynı sekmede setItem yapınca storage olayı tetiklenmez.

Sıradaki ders: Özet - Yerel depolama

Deneyiminizi Geliştiriyoruz

Çerez Tercihleri

Kesinlikle Gerekli Çerezler

Analitik Çerezler