Bu yazıda, arabulucu desen ve JavaScript kullanarak birini uygulamak. JavaScript’teki aracılar, bir dizi nesne arasındaki tüm etkileşimleri içine alan merkezi bir arayüzü ortaya çıkarmamıza izin verir.
Bu kalıp, bir programın çalışma davranışını değiştirdiği ve etkileşimleri koordine etmekten sorumlu olduğu için, bir davranış kalıbı olarak kabul edilir.
Uygulamanızın boyutu büyüdükçe, birbiriyle doğrudan etkileşimde bulunan birden çok nesneniz varsa, bir aracıyı tanıtma ihtiyacı daha fazla talep görür.
Bir RPG oyunu geliştirmenin yarısını bitirdiğinizi ve bir dizi sınıf veya işlev tasarladığınızı varsayın. yapmadı arabulucu modelini kullanın. Bir göz atalım ve neye benzeyebileceğini görelim:
Şimdi kendinizi altında yatan kodu okumaya ve korumaya çalıştığınızı hayal edin. Her şeyi kendi başınıza takip etmeniz ve kimin fonksiyon1 ile iletişim kurar, bu işlev3 ile iletişim kurar işlev9, fonksiyon5 ile iletişim kurar fonksiyon10, fonksiyon8 şuradan veri alır fonksiyon10 ve ona iletir fonksiyon2vb. Elbette bu, hızla bir geliştiricinin en kötü kabusu haline gelir!
Bu koda aracı kalıbı tanıtırken, aracı nesne arasında bir yere yerleştirilecektir ve asıl sorumluluğu, aralarındaki tüm etkileşimi ve davranışı kapsamaktır, kendisini tüm bunları kendi başına halletme sorumluluğunu tayin eder.
Bu şuna benzer:
Şimdi görebileceğiniz gibi, aracı nesne arasında oturur ve artık nesneler kümesi arasındaki etkileşimlerden sorumlu olandır. Şimdi bu uygulamada hata ayıklamayı hayal edin. Buradaki modüllerden biri hata veriyorsa, bakılması gereken iki yerin aracı veya modülün kendisi olduğunu biliyoruz. Bu, mantığı daha belirgin bir şekilde ayırabildiğimiz için daha büyük bir kod tabanını korumayı kolaylaştırır.
Ek olarak, artık nesneler arasındaki yönün daha net bir resmine sahip olduğumuzdan, kodda bir şeyi değiştirmemiz gerektiğinde eskisinden çok daha az güçlük çekmesini sağlayabiliriz.
Arabulucu Modelini tanıtma zamanının geldiğini nasıl bilebiliriz?
Bunu tanıtma ihtiyacı, koddaki bir şey bittiğinde ortaya çıkabilir. çok fazla doğrudan ilişki diğer parçalarla. Bu noktada kodunuz muhtemelen kararsız olacaktır. Açıkça diğer nesnelere atıfta bulunmak yerine, tüm etkileşimlerinin merkezi bir nokta aracılığıyla koordine edilmesini sağlayarak, aralarındaki gevşek bağlantıyı teşvik etmeye yardımcı olur. arabulucu. Bu, bileşenlerimizin kullanılabilirliğini geliştirmemize yardımcı olur.
Gerçek Dünya Analojisi
İşte anlamanıza yardımcı olabilecek gerçek bir dünya benzetmesi nasıl bir arabulucu, verimliliği ve bunun kavramını getirmeye yardımcı olur:
Diğer öğrencilerle birlikte bir sınıftasınız ve öğretmenin yanında bir yığın kağıt var. Bunları dağıtmak istiyor ki her öğrenci bir tane alsın. Öğretmeniniz bir öğrenciye bir kağıt destesi dağıtıp, son öğrenci desteyi alana kadar desteyi arkasındaki öğrenciye iletmek yerine, kağıtları her öğrenciye kendisi iletmeye karar verir. Bundan, her çocuğun bir kağıt parçası almasını ve esasen bir arabulucu rolünü üstlenmesini sağlamaktan sorumludur. Sonunda son öğrenciye ulaşıldığında, odanın karşısındaki başka bir öğrenci elini kaldırarak “Bir kağıt almadım” diyor. Şimdi bu durumu “hata ayıklamaya” çalışıyorsunuz. Görevi her öğrenciye bir kağıt parçası sağlamak olduğu için, arabulucunun eksik kağıttan sorumlu olduğu sonucuna hemen varabilirsiniz. Ek olarak, kağıt yığınının şu anda bu noktada nerede olduğuna dair net bir tahmininiz de var.
Şimdi eğer öğretmen yığını öğrencilere aktarmaya karar verirse, öğrenciler hepsinin bir kağıt almasını sağlamakla yükümlüdürler ve bir öğrenci kağıt almadığını söyleyerek elini kaldırdığında, bu durumu “hata ayıklamak” oldukça zor olacaktır. Birincisi, bilmiyorsun nerede kağıt yığını bu noktada bulunur. İkincisi, neredeyse hiçbir fikrin yok kim süreci karıştırdı. sormak zorunda kalacaksın her öğrenci ve birisinin nasıl kağıt almadığını anlamak için destelerini kime verdiklerini sorun.
Web için JavaScript üzerinde geliştirme yapıyorsanız, zaten aracılar etrafında geliştiriyorsunuz demektir. DOM’da bir arabulucu örneği, belge içindeki DOM öğeleri arasındaki mantığı ve davranışı koordine edebildiği için nesnenin kendisidir. Bir giriş eleman ile
type="radio" mevcut değeri tutabildiğinden hangi telsizin kontrol edileceğine karar verebildiği için arabulucu da olabilir.
Avantajlar
Birbirinizle doğrudan iletişim kuran birden fazla nesneniz olduğunda, esasen bir çoka çok ilişki hata ayıklama sırasında bir kabus haline gelebilir. Arabulucunun tanıtılması, bir arabulucuyu tanıtarak bu sorunun azaltılmasına yardımcı olacaktır. birden çok nesneler arasında akış
Diğer kayda değer faydalar arasında nesneler arasındaki bağımlılıkların azaltılması (gevşek bağlantı), çok daha hafif hatalar, kod bakımı ve okunabilirliği ile artan kolaylık sayılabilir.
Dezavantajları
Hayattaki tüm güzel şeylerde olduğu gibi, her şey mükemmel değildir. Aynı şey aracı model için de geçerlidir.
Örneğin, nesneler arasındaki tüm etkileşimleri koordine etmek için tek bir nesne noktasına sahip olmak, esasen, herhangi bir hata olması durumunda, onun tarafından kapsüllenen her şeyi etkileyeceği anlamına gelir. Bunun bir örneği, arabulucuların birden çok nesne arasındaki etkileşimlerin merkezi noktası olduğundan, uygulamanız büyüdükçe her zaman dolaylı olarak iletişim kurduklarından bunun bir performans sorunu haline gelmesi olabilir.
Bununla birlikte, nesnelerin bunu doğrudan birbirleriyle yapması yerine etkileşimleri yöneten bir aracıya sahip olmak arasında seçim yapmak neredeyse her zaman daha iyi bir seçim olacaktır. Nesnelerden birinde bir şeyi değiştirirsek ve bir şey bir istisna atarsa, uygulamanızın geri kalanında kolayca domino etkisi yaratabilir ve nereden başlayacağınızı bile bilmekte zorlanacaksınız. Daha önceki bir örnekteki gerçek dünya benzetmemiz gibi, kodunuzdaki her bir iletişim noktasını kontrol etmeniz gerekeceğinden, bu durumda hata ayıklamak gerçek bir kabus olacaktır.
Kod Örneği
Bir RPG oyunu yarattığımızı varsayalım ve uygulamak istediğimiz ilk özellikler bir
Novice sınıf ve uygulama parti API’si. Bu parti kavramını hiç duymadıysanız, belirli bir hedefe birlikte ulaşmak için bir müttefik ekip oluşturmak için bir veya daha fazla kullanıcı grubunu bir araya getirdiğiniz zamandır.
bir tanımlayacağız
Novice kurucunun yanı sıra
Game ve
Party. bu
Novice yeni oyuncular oluşturmak için kullanılır,
Party için bir API sağlar. Parti işlevsellik ve
Game kullanacak arabulucu olacak
Party arasındaki ilişkileri oluşturmak için
Novice örnekler (kullanıcılar).
İşte bunun eylem halinde bir kod örneği:
function createId() { const S4 = function() { return (((1 + Math.random()) * 0x10000) | 0).toString(16).substring(1) } return ( S4() + S4() + '-' + S4() + '-' + S4() + '-' + S4() + '-' + S4() + S4() + S4() ) } function Novice(name) { this.name = name this.hp = 100 this.id = createId() this.party = null } Novice.prototype.attack = function(target, hp) { target -= hp return this } const roy = new Novice('roy') const ben = new Novice('ben') const lucy = new Novice('lucy') const sally = new Novice('sally') function Party(leader, ...members) { this.id = createId() this.leader = leader this.members = members } function Game(options) { this.parties = {} if (options) { } } Game.prototype.createParty = function(leader, ...members) { const party = new Party(leader, ...members) this.parties[party.id] = party leader.party = party } Game.prototype.removeParty = function(leader) { delete this.parties[leader.party.id] leader.party = null } const game = new Game() game.createParty(roy, ben, lucy)
Örnekten de anlaşılacağı gibi,
Game birden fazla kullanıcı arasındaki taraf ilişkilerini koordine etmek için örnekler, kodun okunmasını ve bakımını çok daha kolay hale getirir ve arasındaki mantığı ayırır.
Party ve
Novice örnekler.
Aksi takdirde, mantığı doğrudan herhangi birinin tarafı olarak uygulamak zorunda kalırdık.
Novice veya
Party Arayüz, bu durumda onları birleştirmek pek mantıklı değil. Ve işler mantıklı gelmediğinde, bir sorun çıkması durumunda hata ayıklamayı zorlaştırır!
Çözüm
Ve bu, bu noktanın sonunu tamamlıyor! Umarım bunu değerli bulmuşsunuzdur ve gelecekte daha fazlasını ararsınız!