JavaScriptのメディエータパターン質問

Question

私の仕事のメディエータに基づいてライブラリの種類を作成しています。私たちはたくさんのアプリケーションを作成していますので、アプリごとに簡単に取り込んで変更できるものが欲しかったのです。また、「ウィジェット」を作成するのは簡単です（より良い用語がないため）。何かを壊すことを心配することなく簡単に削除することができます。これらのアプリの多くは、外部の開発者がアプリのアプリやウィジェットを作成することで拡張可能です。

これが私がメディエーターのパターンを見つけた理由です。

/あなたはJavaScriptを使用して、このパターンでDOM操作に対処すべきかどう

1. ：私はカントー3つの質問がある

   //Extend 
   Core.extend('widget',function(params){ 
       alert(params.message); 
   }); 
   
   //Load it 
   Core.load('widget',{message:'Hello World'}); 
   
   //Remove it 
   Core.remove('widget'); 
   

   ：私はこのような何かを働く何かを書きましたか？私は、開発者がウィジェットの外でDOMを混乱させたくないのです。

2. どのようにAJAXリクエストを処理する必要がありますか？あなたは何かをすべきか？ライブラリでAJAX/JSONPコールを提供するだけですか（この例ではCore）。

3. 私の最大の質問は、実際に他のウィジェットと実際にやりとりすることですか？私は（明らかに）強くカップルしたくないのですが、別のウィジェットとやりとりする方法はわかりません。たとえば、テキストボックスがあり、送信時にDBに送信するとします。どのようにして別のウィジェットを作ることができますか？それは今すぐ提出されたときに「タイムライン」ウィジェットと呼ばれ、タイムラインをテキストボックスウィジェットのテキストで更新できますか？

=== UPDATEは===

私はこれを書いてしまった：

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

Answer 1

ウィジェットは、ウィジェットとの対話：私はほんの数日前にこれを構築し終えました。私はあなたがそれを実装した方法を見て、あなたのためのいくつかの追加のアイデアがあります。

作成したプッシュシステムは、jQueryのDOMイベントシステムと非常によく似ており、任意のイベントを発行して受信することができます。私はそのシステムを少し使っていますが、デカップルウィジェットを開発することはしていますが、最終的にコンテキストを超えて「イベント」や「エミット」を「プッシュ」するため、彼らがイベントを尋問するまで彼らが望んだ範囲内でさえある。

たとえば、WebページのすべてのUI要素がシステムのウィジェットであるとします。 1ページに30+が簡単にあります。それぞれが「ロードされた」メッセージをプッシュする場合、もう1つのメッセージはそれを受信する必要があります。さらに、あなたが言及したように、サードパーティの開発者はこのシステムのために開発されるでしょう。それから、受信したくないメッセージを除外するために、彼らに負担をかけます。

最新のウィジェット通信システムで取り組んだアプローチは、私が "pubstring"/"substring"アプローチと呼んでいるものです（そして、公平になるためには、他の誰かが私の前でこのアイデアを思いついたと思います。それのためのいくつかのクールなサウンド名を持っています）。基本的に、ウィジェットが「プッシュ」するたびに、そのプッシュは、領域（コンテキスト）、ウィジェットのタイプ、ウィジェットの特定のID、および特定のメッセージを含む文字列に変換されます。

たとえばID 45のウィジェットは、「tweet-list」と入力すると、「カスタム」は「読み込まれました」というメッセージをプッシュします。 pub文字列は、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));

何かが押されたときはいつでも（ie。フレームワークは基本的に__subscriptions配列をループし、格納されている各subString（正規表現）の.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); 

私はそれがあなたにいくつかのアイデアを与えたと思っています。