JavaScript デザインパターンプログラミングにおけるアダプターアダプターパターンの適用の概要 (グラフィックチュートリアル)-jsチュートリアル-php.cn

JavaScript デザインパターンプログラミングにおけるアダプターアダプターパターンの適用の概要 (グラフィックチュートリアル)

亚连

リリース： 2018-05-21 13:59:40

オリジナル

1905 人が閲覧しました

アダプターパターンの役割は、2 つのソフトウェアエンティティ間のインターフェイスの非互換性の問題を解決することです。これは JavaScript、特に AJAX でよく使用されます。次に、JavaScript デザインパターンにおけるアダプターアダプターパターンのアプリケーション分析を見てみましょう。プログラミング

定義
アダプターパターン（アダプター）は、クラス（オブジェクト）のインターフェース（メソッドまたは属性）を、顧客が望む別のインターフェース（メソッドまたは属性）に変換することです。アダプターパターンは、動作しないクラスを作成します。互換性のないインターフェイス (オブジェクト) が原因で一緒に使用すると、ある程度機能する可能性があります。インスタントラッパー。

アダプターのエイリアスはwrapperであり、比較的単純なパターンです。プログラム開発には多くのシナリオがあります。モジュールまたはオブジェクトのインターフェイスを呼び出そうとすると、このインターフェイスの形式が現在のニーズを満たしていないことがわかります。現時点では 2 つの解決策があります。1 つ目は、元のインターフェイスの実装を変更することです。ただし、元のモジュールが非常に複雑である場合、または取得したモジュールが他の人によって書かれた圧縮コードである場合、元のインターフェイスを変更するのは現実的ではありません。。 2 番目の方法は、元のインターフェイスを顧客が必要とする別のインターフェイスに変換するアダプターを作成することです。顧客はアダプターを扱うだけで済みます。

なぜアダプターモードを使用する必要があるのですか?
アプリケーションを開発する場合、ログやそれに類するものを保存するために使用するライブラリなど、アプリケーションの特定の部分を置き換える必要があることがよくあります。新しいライブラリに置き換える場合、新しいライブラリがまったく同じインターフェイスを持つことはほとんどありません。ここからは 2 つのオプションがあります: (1) すべてのコードを確認し、古いライブラリを指すすべてを変更します。
(2) 新しいライブラリが古いライブラリと同じインターフェースを使用できるようにアダプターを作成します。
明らかに、場合によっては、アプリケーションが小さい場合、または古いライブラリへの参照がほとんどない場合は、新しい抽象化レイヤーを追加してコードを作成するよりも、コード全体を調べて、新しいライブラリに一致するようにコードを変更する方が適切です。コードがより複雑になります。ただし、ほとんどの場合、アダプターを作成する方が現実的であり、時間を節約できます。

JavaScript コード例

何かが起こる可能性があるときは、それは起こります。まず、この小さな LoggerFactory を見てみましょう。これにより、使用するログインターフェイスをより簡単に変更できるようになります。

var LoggerFactory = {
  getLogger: function() {
    return window.console;
  },
  ...
};

/* 用法示例 */
var logger = LoggerFactory.getLogger();
logger.log("something to log");

ログイン後にコピー

getLogger を呼び出すと、コンソールオブジェクト (コンソール) が返されます。この演習では、コンソールオブジェクトにはメソッド log が 1 つだけあり、文字列型のパラメータを 1 つだけ受け入れることができると仮定します。次に、別のログインターフェイスがあります。これは、1) JavaScript で実装されており、コンソールのようにブラウザにネイティブではないため、より複雑になります。2) AJAX 経由でログをサーバーに送信します。これは、次のことを意味します。 URL データをエンコードする必要があります (コードは特に URL エンコードを実装しません。これは、これから説明するアダプターパターンとは関係がないためです)。もちろん、コンソールとは異なるインターフェイスが使用されます。

var AjaxLogger = {
  sendLog: function() {
    var data = this.urlEncode(arguments);

    jQuery.ajax({
      url: "http://example.com/log",
      data: data
    });
  },

  urlEncode: function(arg) {
    ...
    return encodedData;
  },
  ...
};

ログイン後にコピー

主に時間を節約し、アダプターパターンで実行したくないことを無視するために、jQuery の AJAX リクエストを使用します。ここで行う必要があるのは、アダプターを作成し、コンソールオブジェクトの代わりにこのアダプターを返すように以前の LoggerFactory を変更することです。

var AjaxLoggerAdapter = {
  log: function(arg) {
    AjaxLogger.sendLog(arg);
  }
};

/* 调整 LoggerFactory */

var LoggerFactory = {
  getLogger: function() {
    // 改变返回值
    return AjaxLoggerAdapter;
  },
  ...
};

ログイン後にコピー

既存のコードに 1 行の変更を加えるだけで、プログラム全体がこの新しいログインターフェイスを使用できるようになります。

複雑なアダプター

ロギングインターフェイスは非常に単純な例であり、メソッドが 1 つだけあり、古いメソッドに直接マッピングすることは難しくありません。ほとんどの場合、これは当てはまりません。相互にマッピングされているこれらの関数のパラメーターがまったく異なるという問題が発生する場合があります。古いインターフェースにはこれらのパラメーターがまったくない場合があり、それらを自分で処理する必要があります。場合によっては、新しいインターフェイスでは単にパラメータが使用されないために、いくつかのパラメータを削除する必要があります。 2 つのオブジェクト間のインターフェイスのマッピングが難しすぎる場合は、別の方法を考えなければなりません。とにかく、何千行もの古いコードを見つけて変更する必要はありません。

上記は私があなたのためにまとめたものです。

JavaScriptのtypeof、null、未定義の関連知識

JavaScript Boolean(ブール値)に関するオブジェクトの知識と使い方

JavaScript Date(日付)に関する知識と使い方

以上がJavaScript デザインパターンプログラミングにおけるアダプターアダプターパターンの適用の概要 (グラフィックチュートリアル)の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。