CodeBlanks Logo Icon CodeBlanks

Özet - Proxy ve Reflect

JavaScript kursu · İleri seviye · Ders 65/100

Proxy ve Reflect kullanarak bir nesnenin özelliklerine erişimi loglayan bir sarmalayıcı yazarsın.

Özet - Proxy ve Reflect

Bu grupta Proxy ile bir nesneyi sarmayı, handler içinde get, set, has ve deleteProperty trap'lerini yazmayı öğrendin. Her trap, target üzerindeki bir işlemi yakalar.

Şimdi bunları bir araya getirerek gerçek bir araç oluşturacaksın: nesne üzerindeki tüm özellik erişimlerini konsola yazdıran bir sarmalayıcı. Hem get hem set trap'lerini Reflect ile birleştireceksin.

Uygulama Loglama proxy'si yaz

data adında host ve port özellikleri olan bir nesne tanımla. handler içinde get trap yaz: önce console.log('read', prop) ile okunan özelliği yazdır, sonra Reflect.get(target, prop) ile değeri döndür. proxy değişkenini new Proxy(data, handler) ile oluştur ve console.log(proxy.host) ile değeri yazdır.

Örnek çözümü göster
const data = { host: 'localhost', port: 3000 };
const handler = {
  get(target, prop) {
    console.log('read', prop);
    return Reflect.get(target, prop);
  }
};
const proxy = new Proxy(data, handler);
console.log(proxy.host);

Sarmalayıcı fonksiyon

Bir sarmalayıcı fonksiyon, herhangi bir nesneyi alıp onu loglayan bir Proxy döndürür. Böylece aynı loglama mantığını birden fazla nesnede yeniden kullanırsın.

function withLog(target) {
  return new Proxy(target, {
    get(t, prop) {
      console.log('read', prop);
      return Reflect.get(t, prop);
    }
  });
}

Burada trap parametreleri t ve prop olarak adlandırılır; t target nesnesini temsil eder. set trap de eklenirse hem okuma hem yazma izlenir. Bu, gerçek uygulamalarda hata ayıklama ve izleme için sıkça kullanılan bir desendir.

Uygulama withLog sarmalayıcısı yaz

withLog adında bir fonksiyon yaz, target parametresi alsın ve new Proxy(target, handler) döndürsün. Handler içinde get ve set trap'leri olsun; her ikisi de önce console.log ile işlemi yazdırsın (get için 'read', set için 'write') sonra Reflect ile davranışı uygulasın (parametre adları t, prop, value). proxy değişkenini withLog({ name: 'Ayşe' }) ile oluştur, proxy.age = 28 ata ve console.log(proxy.name) ile yazdır.

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

Kendini test et

  1. Reflect.get bir get trap'i içinde ne sağlar?

    • Proxy'yi siler
    • yeni bir nesne oluşturur
    • varsayılan okuma davranışını uygular
    • özelliği siler
    Cevabı göster

    varsayılan okuma davranışını uygular — Doğru! Reflect.get, get trap içinden varsayılan okuma davranışını uygular.

  2. Proxy ve Reflect kavramlarını tekrar et

    Proxy
    nesneyi sarmalar
    handler
    trap'leri tutar
    Reflect
    varsayılan davranış
    get trap
    okumayı yakalar
    set trap
    yazmayı yakalar

İleri seviye bölümündeki tüm dersler