Yani, bir meslektaşım bana/abone ol desen (JS/jQuery) yayınlama tanıttı, ama zor bir zaman başa yaşıyorumnedenbu desen üzerinde 'normal'/jQuery JavaScript.

Örneğin, daha önce aşağıdaki kodu vardı

$container.on('click', '.remove_order', function(event) {
    event.preventDefault();
    var orders = $(this).parents('form:first').find('div.order');
    if (orders.length > 2) {
        orders.last().remove();
    }
});

Ve yerine bu işi hak, örneğin bkz

removeOrder = function(orders) {
    if (orders.length > 2) {
        orders.last().remove();
    }
}

$container.on('click', '.remove_order', function(event) {
    event.preventDefault();
    removeOrder($(this).parents('form:first').find('div.order'));
});

Yeniden kullanma olanağı removeOrder işlevleri farklı etkinlikler vb getirir.

Ama neden, eğer aynı şeyi yaparsa yayınla/abone ol desen uygulamak ve aşağıdaki uzunlukları gitmek için karar verin, olur mu? (BİLGİNİZE, jQuery tiny pub/sub kullandım)

removeOrder = function(e, orders) {
    if (orders.length > 2) {
        orders.last().remove();
    }
}

$.subscribe('iquery/action/remove-order', removeOrder);

$container.on('click', '.remove_order', function(event) {
    event.preventDefault();
    $.publish('iquery/action/remove-order', $(this).parents('form:first').find('div.order'));
});

Emin deseni hakkında bir şeyler okumuştum, ama bu şimdiye kadar neden gerekli düşünemiyorum. Bunu açıklamak sunabilirsiniznasılbu modeli uygulamak için sadece kendim gibi temel örnekler kapak.

Pub/sub ikilinin kendini belli daha karmaşık bir uygulama olacağını düşünüyorum, ama hayal bile edemiyorum. Tamamen anlıyorum korkarım; ama eğer bir tane varsa noktasını bilmek istiyorum!

Açıklar mısınızkısacaneden ve hangi durumlarda bu desen avantajlıdır? Benim gibi örnek kod parçacıkları için pub/alt desen kullanarak değer yukarıda mı?

Kaplin ve son birkaç yıl içinde çok modern olan MV* ile el ele gider olan tek sorumluluk, (MVC/MVP/MVVM) desen JavaScript gevşek.

Loose coupling Nesne yönelimli prensip olarak her bileşenin sistemi biliyor, bu sorumluluk ve önemsemiyor diğer bileşenleri (ya da en azından dener değil bakımı hakkında mümkün olduğunca). Kaybetme kaplin kolayca farklı modülleri yeniden kullanabilirsiniz, çünkü bu iyi bir şeydir. Diğer modüllerin arayüzleri ile birleştiğinde değilsin. Yayınlamak/kullanarak sadece büyük bir anlaşma değil yayımlamak/abone arayüzü – sadece iki yöntem ile birleştiğinde sensin abone olun. Eğer farklı bir proje modülünde yeniden yüklemeye karar verirseniz, sadece kopyalama ve yapıştırma ve muhtemelen işe yarar ya da en azından bu işi yapmak için çok çaba gerekmez.

Gevşek bağlantı hakkında konuşuyor separation of concerns bahsetmeliyiz. Eğer bir uygulama MV* mimari desen kullanılarak inşa ediyorsanız, her zaman bir Model(ler) ve bir Görünümü var. Model uygulama iş parçasıdır. Sen-ebilmek yeniden farklı uygulamalar değil, o yüzden iyi bir çift ile görüş tek bir uygulama, nerede göstermek istiyorsun, çünkü genellikle farklı uygulamalar var farklı görüşlere. /Model-View iletişim için abone yayımlamak kullanmak için iyi bir fikirdir. Senin Modelin bir olay yayınlamak değiştiğinde, Görünümü yakalamak ve kendini günceller. Bunun ayırımı için size yardımcı olur abone yayınla gelen herhangi bir yükü yok. Aynı şekilde örneğin kumandaya uygulama mantığı (tam bir Denetleyici değil MVVM, MVP) tutmak ve Görünümünü olabildiğince basit tutun. Açınızı değiştiriyor (ya da örneğin bir kullanıcı tıklatın) ne zaman yeni bir olay sadece yayımlamak Denetleyici yakalamak ve ne yapılacağına karar verecek. Eğer Microsoft teknolojileri MVVM (WPF/Silverlight) MVC desenli ya da hakkında bilgi sahibiyseniz için/Observer pattern gibi yayınlamak abone düşünebilirsiniz. Bu yaklaşım Backbone.js, Knockout.js gibi çerçeveler (MVVM) kullanılır.

İşte bir örnek:

//Model
function Book(name, isbn) {
    this.name = name;
    this.isbn = isbn;
}

function BookCollection(books) {
    this.books = books;
}

BookCollection.prototype.addBook = function (book) {
    this.books.push(book);
    $.publish('book-added', book);
    return book;
}

BookCollection.prototype.removeBook = function (book) {
   var removed;
   if (typeof book === 'number') {
       removed = this.books.splice(book, 1);
   }
   for (var i = 0; i < this.books.length; i  = 1) {
      if (this.books[i] === book) {
          removed = this.books.splice(i, 1);
      }
   }
   $.publish('book-removed', removed);
   return removed;
}

//View
var BookListView = (function () {

   function removeBook(book) {
      $('#'   book.isbn).remove();
   }

   function addBook(book) {
      $('#bookList').append('<div id="'   book.isbn   '">'   book.name   '</div>');
   }

   return {
      init: function () {
         $.subscribe('book-removed', removeBook);
         $.subscribe('book-aded', addBook);
      }
   }
}());

Başka bir örnek. Eğer MV* yaklaşım beğenmedin mi yoksa farklı bir şey (bir sonraki tarif vereceğim tek ve son söz arasında bir kavşak var) kullanabilirsiniz. Sadece farklı modüllerde uygulama yapısı. Twitter örneğin bak.

Eğer arayüzü bakarsanız sadece farklı kutular var. Farklı modül olarak her kutu düşünebilirsiniz. Örneğin bir tweet gönderebilirsiniz. Bu eylem birkaç modül güncelleme gerektirir. Öncelikle güncelleme için profil verileri (üst-sol) ama aynı zamanda zaman çizelgesi güncelleştirme için vardır. Tabii ki, her iki modül için başvurular tutmak ve bunları ayrı ayrı, kendi ortak arabirim kullanarak güncelleme yapabilirsiniz ama daha kolay (ve daha iyi) bir olay yayınlamak için. Bu uygulama daha kolay çünkü kaybetme kaplin değişiklik yapacak. Eğer sadece “-tweet yayınla” olay ve idare. abone olmak için yeni tweetler bağımlı yeni modül geliştirmek Bu yaklaşım çok yararlıdır ve uygulaması çok ayrılmış yapabilirsiniz. Modüller çok kolay yeniden kullanabilirsiniz.

İşte son yaklaşım (bu sadece benim için bir örnek. orijinal twitter kodu değil) temel bir örnek:

var Twitter.Timeline = (function () {
   var tweets = [];
   function publishTweet(tweet) {
      tweets.push(tweet);
      //publishing the tweet
   };
   return {
      init: function () {
         $.subscribe('tweet-posted', function (data) {
             publishTweet(data);
         });
      }
   };
}());


var Twitter.TweetPoster = (function () {
   return {
       init: function () {
           $('#postTweet').bind('click', function () {
               var tweet = $('#tweetInput').val();
               $.publish('tweet-posted', tweet);
           });
       }
   };
}());

Bu yaklaşım için Nicholas Zakas mükemmel bir söylenti var. MV* yaklaşım için en iyi makaleleri ve kitapları, biliyorum Addy Osmani tarafından yayınlanmış.

Sakıncaları. Yayımlamak aşırı kullanımı konusunda dikkatli olmak gerekir/abone ol. Eğer yüzlerce olay var eğer çok kafa karıştırıcı hepsini yönetmek için olabilir. Ayrıca eğer namespacing (ya da değil doğru şekilde kullanarak) kullanıyorsanız değil çarpışmalar olabilir. /Abone yayınlamak gibi görünüyor arabulucu gelişmiş bir uygulama burada https://github.com/ajacksified/Mediator.js bulunabilir. Ve olay gibi “” hangi, tabii ki, kesintiye. köpürme özelliği namespacing var /Abone yayınlama başka bir dezavantajı sabit birim test, zor modüllerde farklı fonksiyonlarını ayırmak ve bunları bağımsız olarak test etmek için olabilir.

Sana yardım ettim umarım soru yeterince açık cevap verdi.