Dekoratör deseni
Bir fonksiyonu başka bir fonksiyonla sarmalayarak davranış eklemeyi öğrenirsin.
Dekoratör deseni
Dekoratör deseni, bir fonksiyonu başka bir fonksiyonla sararak yeni davranış eklemektir. Orijinal fonksiyonun kodunu değiştirmezsin; onu çağıran bir sarmalayıcı yazarsın.
Tipik akış: function decorate(fn) { return function(...args) { /* önce */ const result = fn.apply(this, args); /* sonra */ return result; }; }. Sarmalayıcı aynı parametreleri alır, aynı sonucu döndürür; ama etrafında ek davranış çalışır.
Loglama, önbellekleme, sayaçlama ve zaman ölçümü bu desenle eklenir. Aynı fonksiyona birden fazla dekoratör zincirleyebilirsin.
Önce ve sonra
Dekoratörler davranışı önce ve sonra olarak ikiye böler. Önce kısmında giriş doğrulama, loglama veya sayaçlama yapılır. Sonra kısmında sonuç dönüştürme, önbelleğe yazma veya hata yakalama yapılır.
Bu ayrım fn.apply(this, args) çağrısının konumuna göre belirlenir. Çağrıdan önceki kod önce, sonraki kod sonra çalışır. fn.apply, this bağlamını ve tüm argümanları orijinal fonksiyona geçirir; böylece dekoratör herhangi bir fonksiyonla çalışır.
Uygulama Çağrı loglayan dekoratör
logCall(fn) adında bir dekoratör fonksiyon tanımla. İçinde return function(...args) ile bir sarmalayıcı döndür. Sarmalayıcı önce console.log('calling', fn.name) ile loglasın, sonra const result = fn.apply(this, args) ile çağrı yapsın, console.log('result', result) ile sonucu loglasın ve return result döndürsün. add(a, b) fonksiyonu tanımla (a + b döndürsün). const wrapped = logCall(add) ile sarmala ve console.log(wrapped(2, 3)) ile çağır.
Örnek çözümü göster
function logCall(fn) {
return function(...args) {
console.log('calling', fn.name);
const result = fn.apply(this, args);
console.log('result', result);
return result;
};
}
function add(a, b) {
return a + b;
}
const wrapped = logCall(add);
console.log(wrapped(2, 3));Kendini test et
-
Bir dekoratör ne döndürür?
- Aynı imzalı yeni bir fonksiyon
- Orijinal fonksiyonu değiştirir
- Bir sayı
- Bir Promise
Cevabı göster
Aynı imzalı yeni bir fonksiyon — Doğru! Dekoratör, orijinaliyle aynı parametre ve dönüşlü bir fonksiyon döndürür.
-
Sarmalayıcı içinde çağır
function logCall(fn) { return function(...args) { console.log('calling'); const result = ____; return result; }; }Cevabı göster
function logCall(fn) { return function(...args) { console.log('calling'); const result = fn.apply(this, args); return result; }; } -
Kullanım amacını eşle
- Loglama
- Çağrı ve sonucu yaz
- Önbellekleme
- Sonucu sakla, tekrar döndür
- Sayaç
- Kaç kez çağrıldı
- Zaman ölçüm
- Çağrı süresini ölç