コマンドパターン

コマンドパターンを使用することで、特定のタスクを実行するオブジェクトと、メソッドを呼び出すオブジェクトを_分離_できます。

オンライン食品配送プラットフォームがあるとしましょう。ユーザーは注文の配置、追跡、キャンセルができます。

使用する場合

• 操作を呼び出すオブジェクトと実行するオブジェクトを分離する必要がある場合に使用します
• コマンドが特定のライフサイクルを持つ必要があったり、キューに入れられて特定の時間に実行される場合に有効です

使用しない場合

• アンドゥ/リドゥ、キューイング、ログが不要なシンプルな一度きりの操作
• 直接関数呼び出しで十分に明確で、追加の抽象化が複雑さを増すだけの場合
• システムの操作が少なく、コマンドインフラストラクチャがオーバーエンジニアリングになる場合

手順

• executeメソッドを含むCommandクラスを作成し、アクションをカプセル化します
• 直接メソッド呼び出しをマネージャーの単一のexecuteメソッドに渡されるコマンドオブジェクトで置き換えます
• このパターンはスパリングに使用してください。JavaScriptアプリケーションでは不要なボイラープレートが増える可能性があります

詳細

class OrderManager {
  constructor() {
    this.orders = []
  }

  placeOrder(order, id) {
    this.orders.push(id)
    return `You have successfully ordered ${order} (${id})`;
  }

  trackOrder(id) {
    return `Your order ${id} will arrive in 20 minutes.`
  }

  cancelOrder(id) {
    this.orders = this.orders.filter(order => order !== id)
    return `You have canceled your order ${id}`
  }
}

OrderManagerクラスでは、placeOrder、trackOrder、cancelOrderメソッドにアクセスできます。これらのメソッドを直接使用することは全く有効なJavaScriptです!

const manager = new OrderManager();

manager.placeOrder("Pad Thai", "1234");
manager.trackOrder("1234");
manager.cancelOrder("1234");

しかし、managerインスタンスのメソッドを直接呼び出すことにはデメリットがあります。後で特定のメソッドの名前変更を決定したり、メソッドの機能が変わる可能性があります。

例えば、placeOrderをaddOrderに名前変更することにしたとしましょう!そうすると、コードベース内のどこでもplaceOrderメソッドを呼び出さないようにする必要があり、大規模なアプリケーションではとても複雑になる可能性があります。代わりに、メソッドをmanagerオブジェクトから分離し、各コマンドに対して別のコマンド関数を作成したいです!

OrderManagerクラスをリファクタリングしましょう。placeOrder、cancelOrder、trackOrderメソッドの代わりに、1つの単一メソッドexecuteを持つようになります。このメソッドは渡されたコマンドを実行します。

各コマンドはマネージャーのordersにアクセスする必要があり、これを最初の引数として渡します。

class OrderManager {
  constructor() {
    this.orders = [];
  }

  execute(command, ...args) {
    return command.execute(this.orders, ...args);
  }
}

注文マネージャー用に3つのCommandを作成する必要があります:

• PlaceOrderCommand
• CancelOrderCommand
• TrackOrderCommand

class Command {
  constructor(execute) {
    this.execute = execute;
  }
}

function PlaceOrderCommand(order, id) {
  return new Command((orders) => {
    orders.push(id);
    return `You have successfully ordered ${order} (${id})`;
  });
}

function CancelOrderCommand(id) {
  return new Command((orders) => {
    const index = orders.indexOf(id);
    if (index > -1) orders.splice(index, 1);
    return `You have canceled your order ${id}`;
  });
}

function TrackOrderCommand(id) {
  return new Command(() => `Your order ${id} will arrive in 20 minutes.`);
}

完璧です!メソッドをOrderManagerインスタンスに直接結合するのではなく、OrderManagerで利用可能なexecuteメソッドを通じて呼び出すことができる分離された分離関数になっています。

メリット

コマンドパターンを使用することで、メソッドを操作を実行するオブジェクトから分離できます。特定のライフサイクルを持つコマンドや、キューに入れられて特定の時間に実行されるべきコマンドを処理する場合、より多くの制御が得られます。

デメリット

コマンドパターンのユースケースは非常に限定的で、アプリケーションに不要なボイラープレートが追加されることがよくあります。

ソース

• patterns.dev/vanilla/command-pattern

参考資料

• Command Design Pattern - SourceMaking
• Command Pattern - Refactoring Guru
• Command Pattern - Carlos Caballero