Javascriptli Tasarım Desenlerinin Önemi, NodeJs ve ark.


36

Javascript, önümüzdeki birkaç yıl içerisinde web'in her yerde bulunan programlama dili olarak göründüğü için, her beş dakikada bir açılan yeni çerçeveler ve hem sunucu hem de müşteri tarafında liderlik gerektiren etkinlik odaklı programlama:

Bir Javascript geliştiricisi olarak, geleneksel Tasarım Desenlerini diğer dil / ortamlardakinden önemli veya daha az önemli olarak mı düşünüyorsunuz?

Bir Javascript geliştiricisinin düzenli olarak kullandığı ve Javascript gelişiminizde nasıl yardımcı olduklarına dair bir örnek verdiğiniz için lütfen ilk üç tasarım desenini adlandırın.


5
Bazı insanlar tasarım desenlerinin (özellikle GoF'lerin) dil eksikliğinin belirtileri olduğunu iddia ediyor ( bu tartışmaya bakınız ). JavaScript prototip ve doğada işlevsel olduğundan, başka bir kalıp dizinin uygulanabilir / kullanışlı olduğunu söyleyebilirim.

Cevaplara çok ilgi
duyuyorum

2
Stoyan Stefanov'un JavaScript Şablonları kitabı , JS'de kullanabileceğiniz tonlarca desen için harika bir kaynaktır. Birçoğu özel olarak JS için var, başka bir dil için değil.
IgorGanapolsky,

Javascript kendi kalıplarına sahiptir. Igor tarafından belirtilen kitaba ek olarak, Addy Osmani'nin ücretsiz öğrendiği Javascript Tasarım Desenlerini de Öğrenin .
user16764

Yanıtlar:


23

Bir Javascript geliştiricisi olarak, geleneksel Tasarım Desenlerini diğer dil / ortamlardakinden önemli veya daha az önemli olarak mı düşünüyorsunuz?

Klasik tasarım desenleri JavaScript için geçerli değildir.

Uygulanan, modüler ve fonksiyonel kod yazmaktır.

Yapıcılar ve birinci sınıf fonksiyonların bir karışımını kullanmalısınız.

Bir JavaScript geliştiricisi olarak, kişisel olarak JavaScript'i Java yerine LISP olarak görmeye yöneliyorum. Bu nedenle, klasik OOP kodunu taklit etmeye çalışmak yerine, monadları ve üst düzey fonksiyonel stil kodunu taklit etmeye çalışın.

Bir Javascript geliştiricisinin düzenli olarak kullandığı ve Javascript gelişiminizde nasıl yardımcı olduklarına dair bir örnek verdiğiniz için lütfen ilk üç tasarım desenini adlandırın.

Yine tasarım desenleri gerçekte bu kadarını uygulamamaktadır ancak aşağıda üç önemli yapı bulunmaktadır.

  1. Kapakların kullanımı
  2. Birinci sınıf fonksiyonların kullanımı
  3. Nesne fabrikalarının kullanımı olan veya olmayan new

Lütfen, geleneksel tasarım desenlerini kullanarak aynı tür kodları yapmak yerine, bu tür tekniklerin örneklerini gösterebileceğim bir tür bağlam bırakın.

Klasik Tasarım Desenlerinden bazılarına ve bunların js'de nasıl uygulanacağına ve js'nin kendisine daha uygun alternatif kalıplarına bakalım :

Gözlemci Deseni:

Bu node.jssadece basit events.EventEmitter. Gelen jQuerybu $.fn.bind&& $.fn.trigger. Gelen backbonebu Backbone.Events.triggerve Backbone.Events.bind. Bu, günlük kodda kullanılan çok yaygın bir kalıptır.

Asla durmayacağım ve "Hey burada bir gözlemci kalıbı kullanıyorum!" Hayır, bu sadece mesajları iletmenin ya da kademeli değişimin bir yolu.

Örneğin, omurgada, tüm MVC görünümleri, modeller onchangeolayına bağlanır, böylece modeli değiştirmek, değişiklikleri otomatik olarak görünüme göre basamaklandırır. Evet, bu güçlü bir kalıptır, ancak olay odaklı programlamada kullanımı yaygındır, her yerde kullanmıyordu.

Gelen WebSocketprototcol Elimizdeki .onbiz bağlamak için kullanmak hangi on("message", ...olaylar. Yine, bu çok yaygındır, ancak klasik OOP tabanlı yerine, bir akış üzerinde bir gözlemcidir while (byte b = Stream.ReadNextByte()).

Bunların hepsi Gözlemci deseninin güçlü kullanımlarıdır. Ancak bu kullandığınız bir kalıp değildir. Bu dilin basit bir parçası. Bu sadece kod.

Memento Deseni:

Bu sadece JSON. Bir eylemi geri almak için nesnenin durumunu seri hale getirmenize izin verir.

function SomeObject() {
    var internalState;

    this.toJSON = function() {
        return internalState;
    }

    this.set = function(data) {
        internalState = data;
    }

    this.restore = function(json) {
        internalState = JSON.parse(json);
    }
}

var o = new SomeObject();
o.set("foo"); // foo
var memento = JSON.stringify(o);
o.set("bar"); // bar
o.restore(memento);

JavaScript'te yerel olarak bir mementos API'sini destekliyoruz. Sadece toJSONherhangi bir nesne üzerinde çağrılan bir yöntem tanımlayın . Aradığınızda JSON.stringifydahili olarak arayacak .toJSONJSON serialize istediğiniz gerçek verilere ulaşmak için nesne üzerinde.

Bu, kodunuzun önemsiz anlık görüntülerini yapmanızı sağlar.

Yine, bunun hatıra bir kalıp olduğunu anlamıyorum. Bu sadece JSON olan serileştirme aracını kullanıyor.

Devlet Deseni / Strateji Deseni:

Devlet düzenine ihtiyacınız yok. Birinci sınıf fonksiyonlarınız ve dinamik tipleriniz var. Sadece işlevleri enjekte edin veya anında özellikleri değiştirin.


Raynos, Güzel cevap. Örnek olarak, kavramsal seviyeden daha fazlasını düşünüyordum. Örneğin: "bir gözlemci durumu bu duruma yardımcı oldu ..."

@Lewis sevdiğiniz birkaç tasarım modelini seçer ve daha sonra daha uygun fonksiyonel alternatifler önermeye çalışacağım.
Raynos

Çaba yaklaşımı ve cevap parlak Raynos. Teşekkürler.
Lewis,

@Lewis Birkaç taneye daha fazla bakmaya çalıştım ancak hepsi katı klasik OO dilleri için tasarlandığından dolayı güdük aldım. Bakmamı istediğin başka tasarım desenleri varsa haber ver.
Raynos

Prototip modelini unuttun - aka aptal javascript normal
oop'a

10

Bu cevabı öznel görüş olarak alın.

Bir Javascript geliştiricisi olarak, geleneksel Tasarım Desenlerini diğer dil / ortamlardakinden önemli veya daha az önemli olarak mı düşünüyorsunuz?

Gang of Four gibi geleneksel tasarım kalıplarını kastediyorsanız , tekniklerin çoğu "Arayüzey için bir program değil bir program" veya "sınıf mirasına göre nesne kompozisyonunu tercih etme" veya "Kalıtımsallık için nesne kompozisyonunu tercih etme" gibi dil / platform agnostiğidir ve JavaScript geliştiricileri için de aynı derecede önemlidir.

Yaratılışsal, yapısal ve davranışsal gibi daha spesifik modeller, dil özellikleri kullanımlarını büyük ölçüde etkileyebileceğinden, aynı şekilde veya diğer dillerde olduğu kadar sık ​​kullanılmaları gerekebilir veya gerekmeyebilir. Bazı diller (JavaScript dahil) bu nedenle sunduğu işlevsellik veya sözdizimsel şekere dayalı kendi tasarım kalıplarına sahiptir.

Genel olarak, geleneksel tasarım desenlerinin diğer dillerde olduğu kadar önemli olduğunu, ancak JavaScript'e özgü desenlerin geleneksel olanlardan daha önemli olduğunu söyleyebilirim.

Javascript geliştiricisinin düzenli olarak kullandığı ve size Javascript gelişiminde nasıl yardımcı olduklarına dair bir örnek olarak, ilk üç tasarım desenini adlandırın

Temel JavaScript Tasarım Desenleri arasında çoğunlukla bunları kullanırım:

1. Oluşturucu deseni (Prototiplerle)

Özellikle node.js dosyası yazarken sunucu tarafında, çünkü yerel kapsülleme olmamasına rağmen modüller yazmak için çok uygundur. Ayrıca GitHub'taki havuzlara göz atarsanız, diğer birçok geliştirici için de popülerdir, bu nedenle bu forma aşina olmak diğer kodları daha iyi anlamanıza yardımcı olabilir.

2. Modül Desenini Açığa Çıkarma

Kapsülleme ile modülerlik sunar.

3. KURU Desen

Bu, her senaryo için mümkün olduğu kadar (im) kullanması gerektiğine rağmen, senaryoya özgüdür.


Teşekkürler! Güzel cevap ve umduğum cevap türü. Her ne kadar soru öznel olarak görünse de, buna benzer iyi bir cevap uygun bir cevap olduğunu göstermektedir. 'İmzalamadan' önce daha fazla yanıt bekler.

2

Tasarım kalıpları, CS için tasarım sınıflarında öğretilir. Gerekli değiller, ancak üzerinde düşünülmüş bir çözüme sahip olacak benzer durumlar bulabilirseniz gerçekten yardımcı olurlar.

Ayrıca programcıların daha kolay iletişim kurmasını sağlar. İş arkadaşınızla da kalıpları açısından konuşabilirsiniz. Burada söylersem Gözlemcime sahibim, o zaman neler olup bittiği çok iyi anlaşılıyor.

İnsanlar doğal olarak kendi başlarına bir tasarım modeline uyacak çözümler üretecekler, ancak tasarım modelleri yardımcı olabilecek terminolojiyi ve standart fikirleri tanımlamaya yardımcı olacak.

Desenler hakkında dikkate değer bir şey yoktur, en güzel şey, kanonlanmış ve tekrar tekrar yararlı olacak şekilde tanımlanmış fikirler olmasıdır.


1

Bir Javascript geliştiricisi olarak, geleneksel Tasarım Desenlerini önemli veya daha az önemli olarak kabul ediyor musunuz?

Onlar hayati.

Bunun nedeni, yeniden kullanılabilir çözümler için kavramların dili aşabilmesidir. - sözdizimi değişiklikleri - uygulama değişiklikleri - Desen için kavram hala var.

Herhangi bir dilden gelen geliştiriciler gelişmiş JS'yi sözdizimini değil, öğrenme kalıplarını öğrenerek öğrenebilir. Bunu bilmeyenler eksik.

Javascript geliştiricisinin düzenli olarak kullandığı için lütfen en üstteki üç tasarım desenini adlandırın.

Bazılarının karşı çıkacağı "sıkça kullanılan desenler" var. Ancak, ileri düzey JS'de oldukça yaygın ve güçlü oldukları için bunu bilmek iyidir.

1- Ad alanı - kodunuzu bir nesneye sarın.

var x = (function () {}) ();

2- ObjectConfiguration, Fabrika benzeri desen. -Bir işleve bir nesne koyar, bir sürü vars.

var ürün = fabrika ({});

3- Geri arama işlevi. - Görev tamamlandığında çağrılacak bir işlevi parametre olarak iletin.

function longTask (function () {// bitince beni ara});

Söylediğim gibi, bazıları bunların kalıp olmadığını, ancak çok yaygın ve çok güçlü olduklarını ve sık sık sıkça karşılaşılan sorunlara gerçekten çok yararlı tekrarlanabilir çözümler olduklarından bahsetmelidir. Tasarım deseni tanımı hangisidir?

Mükemmel soru

Umarım yardımcı olur.

Sitemizi kullandığınızda şunları okuyup anladığınızı kabul etmiş olursunuz: Çerez Politikası ve Gizlilik Politikası.
Licensed under cc by-sa 3.0 with attribution required.