Özet - Proxy ve Reflect
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
-
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.
-
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