Mixin Pattern
Bu yazı , Addy Osmani ve Lydia Hallie tarafından yazılmış olan Learning Patterns kitabının Mixing Pattern adlı bölümününün Türkçe çevirisini içermektedir .
https://www.patterns.dev/posts/mixin-pattern/
Mixin, kalıtım kullanmadan,başka bir nesneye veya sınıfa yeniden kullanılabilir işlevsellik (reusable functionality) eklemek için kullanabileceğimiz bir nesnedir. Mixinleri, kendi başlarına kullanamayız, mixinlerin amacı , kalıtım olmaksızın nesnelere veya sınıflara işlevsellik eklemektir .
Mesela, oluşturacağımız bir uygulamada birden çok “köpek”(Dog) nesnesi oluşturmamız gereksin. Ama oluşturacağımız ana “köpek”(Dog) nesnemizin “isim” özelliği dışında başka bir özelliği olmasın.
Bir “köpek”(Dog), bir isme sahip olmaktan daha fazlasını yapabilmelidir. Bir köpek havlayabilmeli, kuyruğunu sallayabilmeli ve oynayabilmeli!
Bunu doğrudan “Dog” sınıfına eklemek yerine, bizim için havlama (bark ), kuyruğunu sallama(wagTail )ve oyun (play) özelliği sağlayan bir mixin oluşturabiliriz.
“dogFunctionality” mixinini , Object.assign metodu ile “Dog” prototipine ekleyebiliriz. Bu metod, hedef nesneye :Dog.prototype yeni özellikler eklemizi sağlar.
Dog nesnesinden oluşturulan her yeni örnek (instance) , Dog prototipine eklendiği için , dogFunctionality mixinin içeriğindeki özelliklere erişebilecektir.
Hadi şimdi gelin, ilk evcil hayvanımız olan pet1'i Daisy isminde oluşturalım. DogFunctionality mixinini, Dog prototipine eklediğimiz için,Daisy yürüyebilmeli, kuyruğunu sallayabilmeli ve oynayabilmelidir.
Mükemmeeel! Mixinler , kalıtım kullanmadan sınıflara veya nesnelere özel metodlar eklememizi kolaylaştırır.
Kalıtım olmadan mixinler ile işlevsellik ekleyebilsek de, mixinlerin kendileri kalıtımı kullanabilir!
Birçok memeli (yunuslar da dahil , ve hatta belki daha da fazlası ) yürüyebilir ve uyuyabilir. Köpekler de bir memelidir dolayısıyla bir köpek hem yürüyebilmeli hem de uyuyabilmelidir.
Haydi şimdi yürüme(walk) ve uyuma(sleep)özelliklerini ekleyen bir animalFunctionality mixini oluşturalım .
Biz bu özellikleri , Object.assign kullanarak dogFunctionality prototipine ekleyebiliriz. Bu durumda, hedef nesnemiz : dogFunctionality olmaktadır.
Mükemmel! Dog ‘un her yeni örneği artık yürüme(walk) ve uyku(sleep) metodlarına erişebilir.
Buradaki koda aşağıdaki linke tıklayarak ulaşabilirsiniz:
Mixin’in gerçek dünyadaki örneği, tarayıcı ortamında Window arayüzünde görülebilir. Window nesnesi , setTimeout ve setInterval, indexedDB, ve isSecureContext gibi özelliklere erişmemizi sağlayan birçok özelliği, WindowOrWorkerGlobalScope veWindowEventHandlers mixinlerinden alır.
Bu bir mixin olduğu için ve sadece nesnelere işevsellik eklemek için kullanıldığı için WindowOrWorkerGlobalScopetipinde nesneler oluşturamazsınız.
Buradaki koda aşağıdaki linke tıklayarak ulaşabilirsiniz:
React (pre ES6)
Mixin’ler, ES6 sınıfları tanıtılmadan önce, React bileşenlerine işlevsellik eklemek için sıklıkla kullanılırdı. React ekibi, bileşenlere gereksiz karmaşıklık ekleyerek bakımını ve yeniden kullanımını zorlaştırdığı için mixinlerin kullanımını önermez. Bunun yerine Hooks ile değiştirilebilen, yüksek dereceli bileşenlerin kullanımını tavsiye ederler.
Mixinler, bir nesnenin prototipine işlevsellik tanıtarak, nesnelere kalıtım kullanmadan, işlevsellik eklememize izin verir. Bir nesnenin prototipini değiştirmek, prototip kirliliğine ve işlevlerimizin kökeni ile ilgili belirsizliğe yol açabileceğinden, kötü bir kullanım olarak görülür.
Kaynakça
- Functional Mixins — Eric Elliott
- Mixins — JavaScript Info
