2

ページ上の div 要素に SVG グラフを描画するような処理を行う JavaScript ライブラリ (.js ファイル) があるとします。ライブラリはビジネス ロジックを適用し、要素がクリックされたときなどのイベント ハンドラーも作成します。疑似コードは次のようになります。

myLib = {};
myLib.dummy = null;
mylib.doStuff = function(divID) {
  //divID is the ID of the element on which SVG graph will be drawn
  //does graph drawing and sets up myLib.dummy for feedback or such, e.g.:
  myLib.dummy = $("#divID").width();
}

私の質問は、このスクリプトを同じページの 2 つ (またはそれ以上) の要素に適用し、各要素に関連する myLib の個別の「インスタンス」を持ちたい場合をどのように処理するかです。私はページからこのように呼び出すことができないことを知っています:

myLib.doStuff('topDiv');   //myLib.dummy will be say 400;
myLib.doStuff('bottomDiv');   //myLib.dummy will be say 600;

上記のコードでは、同じ名前空間を使用しているため、ID = 'topDiv' の div に関連する myLib.dummy にアクセスできなくなります。

設計パターンが欠落しているか、単に名前空間が原因であると思われます。

提案や助けをいただければ幸いです。

4

1 に答える 1

2 
function makeALib() {
    var myLib = {};
    myLib.dummy = null;
    mylib.doStuff = function(divID) {
      //divID is the ID of the element on which SVG graph will be drawn
      //does graph drawing and sets up myLib.dummy for feedback or such, e.g.:
      myLib.dummy = $("#divID").width();
    }
    return myLib;
}

var libA = makeALib();
var libB = makeALib();

libA.doStuff('topDiv'); 
libB.doStuff('bottomDiv');

分離または間接化を導入できるさまざまな領域があります。使用状況について詳しく知らなければ、何が適切な選択であるかを判断するのは困難です。しかし、上記は多くの実用的な選択肢の 1 つです。

于 2012-10-18T02:15:19.857 に答える