TypeScript'te Gözlemci Tasarım Modelini Uygulama

TypeScript'te Gözlemci Tasarım Modelini Uygulama

Tasarım deseni, yazılım tasarımında yaygın olarak tekrarlanan bir sorunu çözen bir şablondur.





Yayınla-abone ol modeli olarak da bilinen gözlemci kalıbı, bir davranış kalıbıdır. Birden çok nesneyi veya aboneyi, gözlemledikleri nesnede yayınlanan herhangi bir olay hakkında bilgilendirmenize olanak tanır.





google play hizmetleri nasıl düzeltilir
GÜNÜN YAPILAN VİDEOSU

Burada TypeScript'te gözlemci tasarım deseninin nasıl uygulanacağını öğreneceksiniz.





Gözlemci Modeli

Gözlemci modeli, yayıncı ve aboneleri arasında bire çok ilişki tanımlayarak çalışır. Yayıncıda bir olay meydana geldiğinde, tüm aboneleri o olayla ilgili bilgilendirecektir. Bu modelin yaygın bir örneği, JavaScript olay dinleyicileri .

Bağlam için, mağazanızdaki ürün sayısını takip eden bir envanter izleyici oluşturduğunuzu varsayalım. Bu durumda mağazanız konu/yayıncı, envanteriniz ise gözlemci/abonedir. Bu durumda gözlemci tasarım modelini kullanmak en uygunudur.



Gözlemci tasarım modelinde, konu sınıfınız üç yöntem uygulamalıdır:

  • Bir eklemek yöntem. Bu yöntem konuya bir gözlemci ekler.
  • A ayırmak yöntem. Bu yöntem, bir gözlemciyi bir konudan uzaklaştırır.
  • A bildir/güncelle yöntem. Bu yöntem, öznedeki durum değiştiğinde öznenin gözlemcilerini bilgilendirir.

Gözlemci sınıfınız bir yöntem uygulamalıdır, Güncelleme yöntem. Bu yöntem, öznesinin durumunda bir değişiklik olduğunda tepki verir.





Konu ve Gözlemci Sınıflarının Uygulanması

Bu kalıbı uygulamanın ilk adımı, doğru yöntemleri uyguladıklarından emin olmak için konu ve gözlemci sınıfı için arayüzler oluşturmaktır:

// Subject/Publisher Interface 
interface Subject {
attachObserver(observer: Observer): void;
detachObserver(observer: Observer): void;
notifyObserver(): void;
}

// Observer/Subscriber Interface
interface Observer {
update(subject: Subject): void;
}

Yukarıdaki kod bloğundaki arabirimler, somut sınıflarınızın uygulaması gereken yöntemleri tanımlar.





Somut Bir Konu Sınıfı

Bir sonraki adım, aşağıdakileri uygulayan somut bir konu sınıfını uygulamaktır. Ders arayüz:

// Subject 
class Store implements Subject {}

Ardından, Ders içinde bulunduğu durum Mağaza sınıf. Öznenin gözlemcileri bu durumdaki değişikliklere tepki göstereceklerdir.

hesabınızı devre dışı bıraktığınızda ne olur

Bu durumda, durum bir sayıdır ve gözlemciler sayıdaki artışa tepki verirler:

// Subject state 
private numberOfProducts: number;

Ardından, bir dizi gözlemciyi başlatın. Bu dizi, gözlemcileri nasıl izleyeceğinizdir:

// initializing observers 
private observers: Observer[] = [];