JavaScript調解器模式問題

Question

我正在爲我的工作創建一種基於調解器的庫。我們創建了大量應用程序，因此我希望能夠根據每個應用程序輕鬆進行修改。我也希望它很容易創建「小部件」（缺少更好的術語），並且易於刪除它們而不用擔心會破壞任何內容。我們製作的這些應用程序中的許多應用程序都可以由外部開發人員進行擴展。

這就是我遇到中介模式的原因。我寫了一些作品是這樣的：

//Extend 
Core.extend('widget',function(params){ 
    alert(params.message); 
}); 

//Load it 
Core.load('widget',{message:'Hello World'}); 

//Remove it 
Core.remove('widget'); 

我有壽3個問題：

1. 如何/你應該在這個模式用JavaScript處理DOM操作？我不希望開發人員在其小部件外部搞亂DOM。

2. 您應該如何處理AJAX請求？你應該做什麼？你應該在庫中提供一個AJAX/JSONP調用（本例中爲Core）。

3. 我最大的問題是，你怎麼實際上與其他小部件交互？我不想緊張的情侶（顯然），但我不明白你如何與另一個部件進行交互。例如，假設您有一個文本框並在提交時將其發送給數據庫。另一個窗口小部件如何稱爲「時間軸」窗口小部件，現在提交它，然後用文本框小部件中的文本更新時間軸？

=== UPDATE ===

我結束了寫這個：

http://oscargodson.github.com/Core.js/

Answer 1

窗口小部件與部件交互：我剛剛完成建設這個前幾天。我審視了你實施它的方式，這裏有一些額外的想法給你。

您創建的推送系統與jQuery的DOM事件系統非常相似，可以發送和接收任意事件。我一直在使用這個系統做一些開發去耦的小部件，但是我發現它非常需要，因爲最終「推」（事件，發射，任何）都脫離了上下文 - 就像聽衆不知道這是否是這樣甚至在他們詢問事件之前都在他們想要的範圍內。

例如，如果網頁上的每個UI元素都是您系統中的小部件，在一頁上很容易就會有30+。如果每個人推送一個「加載」的消息，其他29個必須接收它。此外，正如您所提到的，第三方開發人員將爲此係統開發。然後，他們將負擔放在他們身上，過濾出他們不想收到的信息。

我在我最新的widget-communication系統中採用的方法就是我稱之爲「pubstring」/「substring」方法（並且公平地說，我確信有人在我之前提出了這個想法，有一些很酷的冠冕堂皇的名字）。基本上，無論何時一個小部件「推」，該推送都會變成一個字符串，其中包含：領域（上下文），小部件的類型，小部件的特定ID（無論它可能是什麼）以及特定的消息。

舉例來說，一個ID爲45的小工具在領域「自定義」中鍵入「tweet-list」，並將消息「加載」。酒吧字符串然後將呈現爲：custom.tweet-list.45.loaded。

當訂閱被放置時，它們通過散列表輸入，它可以選擇性地包含4個屬性的值（除了realm/type/id/msg之外，您可以輕鬆添加更多值）。然後聽會是這樣：

listen({ realm: 'custom', type: 'whatever' }, f); // (where 'f' is a function)

您框架的監聽部分可以把這一哈希表爲「子」，這將是一個正則表達式表達過濾器，它代表：

custom\.whatever\.[^\.]+\.[^\.]+

該正則表達式被存儲爲正則表達式編譯到一些隱藏數組...

__subscriptions.push(new RegExp(subString));

然後每當有東西被推動（即。發佈）框架基本上遍歷__subscriptions數組，引發每個存儲的子字符串（正則表達式）的.test，並在匹配時執行該子字符串的回調。

使用這個系統無限過濾聽衆可以應用和聽衆知道他們正在接受因爲只有他們感興趣的語境通知

例子：

// Listen for all messages by widget ID #99 
listen({ id: 99 } ,f); 

// Listen for all messages by widgets in realm clientB 
listen({ realm: 'clientB' }, f); 

// Listen for the data-received push of widgets whose type is tweet-list 
listen({ type: 'tweet-list', message: 'data-received' }, f); 

因爲正則表達式是真的只是一個串聯，正則表達式也可以包含在過濾器中。

// Listen for any data- message 
listen({ message: 'data-[^\.]+' }, f); 

該系統的優點是，你仍然可以保持當前的界面，「保持簡單的事情」，只是測試一個字符串或argument[0]哈希表。換句話說..

// This 
listen('loaded', f); 

// Could be equivalent to this on the backend: 
listen({ message: 'loaded' }, f); 

我知道這很長，但希望它給你一些想法。