CodeBlanks Logo Icon CodeBlanks

Özet - Metaprogramlama

JavaScript kursu · Uzman · Ders 41/63

Proxy, Reflect ve dekoratör deseni ile bir loglama sarmalayıcı yazarsın.

Özet - Metaprogramlama

Bu grupta dört tekniği gördün. Yansıma ile bir nesnenin yapısını okudun; Proxy ile atamaları doğruladın; Reflect ile trap içinde varsayılan davranışı uyguladın; Symbol.iterator ile nesneyi dolaşılabilir yaptın ve dekoratör ile fonksiyonları sarmaladın.

Hepsinin ortak noktası: kod, başka kodun yapısını veya davranışını yönetir. Bu sayede tek bir yerde tanımladığın davranışı her atamada, her çağrıda veya her döngüde uygulayabilirsin.

Son adımda bunları birleştirerek bir loglama sarmalayıcı kuracağız.

Teknikleri birleştir

Bir loglama sarmalayıcı, hem Proxy hem Reflect hem dekoratör fikrini birleştirir. Amaç: bir nesneye yapılan her okuma ve atamayı izlemek.

Yaklaşım şu: function withLog(target) fonksiyonu bir handler tanımlar; get trap'i console.log('get', prop) yapıp return Reflect.get(target, prop, receiver) döndürür; set trap'i benzer şekilde loglayıp Reflect.set ile uygular. Sonra return new Proxy(target, handler) döndürülür.

Bu tek fonksiyon, herhangi bir nesneyi şeffaf biçimde izlenebilir hale getirir.

Uygulama Loglama sarmalayıcı kur

withLog(target) adında bir fonksiyon tanımla. İçinde handler nesnesi tanımla; get(target, prop, receiver) trap'i console.log('get', prop) yapıp return Reflect.get(target, prop, receiver) döndürsün; set(target, prop, value, receiver) trap'i console.log('set', prop, value) yapıp return Reflect.set(target, prop, value, receiver) döndürsün. En son return new Proxy(target, handler) yap. user nesnesi tanımla, const logged = withLog(user) ile sarmala, logged.age = 28 ata ve console.log(logged.name) ile yazdır.

Örnek çözümü göster
function withLog(target) {
  const handler = {
    get(target, prop, receiver) {
      console.log('get', prop);
      return Reflect.get(target, prop, receiver);
    },
    set(target, prop, value, receiver) {
      console.log('set', prop, value);
      return Reflect.set(target, prop, value, receiver);
    }
  };
  return new Proxy(target, handler);
}
const user = { name: 'Ayşe' };
const logged = withLog(user);
logged.age = 28;
console.log(logged.name);

Kendini test et

  1. Loglama sarmalayıcı hangi iki tekniği birleştirir?

    • Yalnızca Symbol.iterator
    • Proxy ve Reflect
    • Yalnızca dekoratör
    • typeof ve instanceof
    Cevabı göster

    Proxy ve Reflect — Doğru! withLog bir Proxy kurar ve Reflect ile log sonrası varsayılan davranışı uygular.

  2. Tekniği görevine eşle

    Proxy
    Atamayı doğrula
    Reflect
    Varsayılan davranış
    Symbol.iterator
    for...of ile dolaş
    Dekoratör
    Fonksiyonu sarmala

Uzman bölümündeki tüm dersler