2

私はjavascriptを使って依存性注入をいじっていますが、助けが必要な質問がいくつかあります

簡単な例は、私が持っているダイアログモジュールです。ページ上の複数の場所で使用され、ユーザーがページ上のコンポーネントを操作すると、カスタムメッセージでユーザーに警告します

function Dialog () {

}

Dialog.prototype.show = function () {

}

これは、ユーザー検索を検証する検索コントロールなどのコンポーネントで使用でき、空の場合はエラーダイアログを起動します。依存性注入を使用すると、次のように書くと思います。

function searchComponent (dialog) {
   this.dialog = dialog
}

searchComponent.prototype.validateSearch = function () {
    // validate search if invalid create error
    this.dialog.show();
}

var searchDialog = new Dialog();
var search = new searchComponent(searchDialog);

ただし、ユーザーが検索エラー ダイアログを必要とすることはないかもしれませんが、そのインスタンスを作成して、依存関係を渡すことができるようにしています。ページにダイアログの個別のインスタンスが 100 あるとしたら、これらの 100 回を構築しますか?これは不要であり、パフォーマンスが高くなります。

私がむしろしたいのは、必要なときにダイアログの構築を遅延ロードすることです

searchComponent.prototype.validateSearch = function () {
  //validate search if invalid create error
  var dialog = new Dialog();
  dialog.show();
}

これが欠点を生むことを知った今、これらの1つは単体テストへの影響です。私が理解したいのは、何かを逃したか、別の方法を見逃したかどうかです。

前もって感謝します

4

4 に答える 4

7

JavaScript 関数はファースト クラス オブジェクトです。構築されたダイアログを渡す代わりに、ダイアログ コンストラクター関数を渡します。

var search = new SearchComponent(Dialog);

次に、必要なときにそれを新しくします。

function SearchComponent(Dialog) {
  this.Dialog = Dialog;
}

SearchComponent.prototype.validateSearch = function() {
  var dialog = new this.Dialog();
  dialog.show();
}
于 2013-03-03T19:25:49.130 に答える
1

@ChrisTavares の優れたソリューションを拡張するには、次のようなものを使用して、Dialog可能性のある内部で依存性注入を行うこともできます。

var foo = function () { return new Foo() }; // just an example
var search = new SearchComponent(function() {
    return new Dialog(foo());
});

あなたの中にSearchComponent：

function SearchComponent(Dialog) {
    this.Dialog = Dialog;
}

SearchComponent.prototype.validateSearch = function () {
    var dialog = new this.Dialog();
    dialog.show();
};
于 2013-03-03T19:29:42.533 に答える
0

私は最近、infect.js という依存性注入ライブラリを作成しました。それをチェックしてください、あなたが探しているものかもしれません。https://github.com/amwmedia/infect.js

于 2013-11-17T18:08:29.937 に答える