Javascriptでビルダーパターンを実装する方法

Javascriptでビルダーパターンを実装する方法

概要

ビルダー パターンは比較的単純なデザイン パターンであり、作成パターンに属します。

定義: 複雑なオブジェクトを複数の単純なオブジェクトに分解して構築し、複雑な構築層とプレゼンテーション層を分離して、同じ構築プロセスで異なるプレゼンテーション モードを作成できるようにします。

アドバンテージ:

  • ビルダー パターンではカプセル化が強化され、オブジェクトの作成と構築のプロセスが分離されます。
  • ビルダー パターンは簡単に拡張できます。拡張が必要な​​場合は、新しいビルダーを使用して拡張できます。

モード機能:

  • 複雑なオブジェクトを段階的に作成する
  • パッケージングプロセスとコンポーネントの特定の作成を切り離す
  • コンポーネントの組み立て方法を心配する必要はありません

注記:

  • 安定したアルゴリズムのサポートが必要
  • 加工技術が公開されているため、富裕層はいつでも家がどのように建てられているかを見に行くことができます。

俗語による説明:

金持ちが家を建てたいとします。必要なのは請負業者を見つけることだけです。請負業者は家を建てるための建設チームを見つけます。建設チームを編成して建設を開始するために、労働者を 1 人ずつ探す必要はありません。請負業者は金持ちのニーズを知っており、建設チームを編成するために労働者をどこで見つけるかも知っています。労働者は直接作業できるため、金持ちは労働者と直接やり取りするコストを節約できます。金持ちは家の建て方を知る必要はありません。最後に家を検査できればよいだけです。

コードの実装

コードを書く前に、まず分析してみましょう。

1. 出力は家です

2. 請負業者は作業員を呼び出して作業を開始し、作業員の具体的な主要プロジェクトについて明確に伝える必要があります。

3. 労働者は寝室、リビングルーム、キッチンを建設できる住宅建設者です。

4. 請負業者は単なるインターフェースです。他の人に家を建てるように指示するだけで、何もする必要はありません。

関数Fangzi(){
    this.woshi = "";
    this.keting = "";
    this.chufang = "";
}

関数 Baogongtou(){
    this.jianfangzi = function(gongren){
        gongren.jian_woshi();
        gongren.jian_keting();
        gongren.jian_chufang();
    }
}

関数 Gongren(){
    this.jian_woshi = 関数(){
        console.log("寝室が完成しました!");
    }

    this.jian_keting = 関数(){
        console.log("リビングルームが完成しました!");
    }

    this.jian_chufang = 関数(){
        console.log("キッチンが完成しました!");
    }

    this.wangong = 関数(){
        var fangzi = 新しい Fangzi();
        fangzi.woshi = "OK";
        fangzi.keting = "ok";
        fangzi.chufang = "OK";
        牙子を返す;
    }
}
gongren = new Gongren();
baogongtou = new Baogongtou() とします。
//寝室が完成しました!
//リビングルームが完成しました!
//キッチンが完成しました!
宝公頭建方子(公人);
var my_fangzi = gongren.wangong();
/*
ファンジ=
       チューファン:「OK」
       keting: 「OK」
       をし: 「わかった」
       }
*/
コンソールにログ出力します。

上記のコードでは、Gongren() に具体的な建設プロセス、つまり具体的な作業が含まれていることがわかります。Fangzi() は最初は空で、リビングルーム、キッチン、寝室はありません。Baogongtou() は、家を建てることができることを宣伝し、次にワーカー メソッドを渡してワーカーを呼び出して建設を行います。ワーカー メソッドが実行されると、建設が完了し、その後家が引き渡されます。Fangzi() メソッドを新しいメソッドでインスタンス化し、新しいメソッドで再割り当てします。

以上がJavascriptでビルダーパターンを実装する方法の詳細です。Javascriptビルダーパターンの詳細については、123WORDPRESS.COMの他の関連記事に注目してください。

以下もご興味があるかもしれません:
  • JavaScript デザインパターン - ビルダーパターンの原則とアプリケーション例の分析
  • JavaScript デザインパターン ビルダーパターン例チュートリアル
  • JavaScript デザインパターン クラシックビルダーパターン
  • JSビルダーモードの基本的な使用例の分析
  • JavaScript徹底理解シリーズ(27):デザインパターンにおけるビルダーパターンの詳細解説
  • JavaScript デザインパターン ビルダーパターンの紹介
  • JS デザイン パターン: ファクトリー パターンの定義と実装の簡単な分析
  • JS デザイン パターン: シングルトン パターンの定義と実装の簡単な分析
  • JavaScript デザイン パターン - ビジター パターンの原則と使用例の分析
  • JavaScript デザインパターン - テンプレートメソッドパターンの原則と使用例の分析

<<:  CentOS7にPHP7 Redis拡張機能をインストールする方法

>>:  Linux パーティションまたは論理ボリュームにファイルシステムを作成する方法

推薦する

Vueコンポーネントの詳細な説明

<本文> <div id="ルート"> <h2&...

一般的なイベントを処理するための JavaScript の使用に関する詳細な説明

目次1. フォームイベント2. マウスイベント3. キーボードイベント4. 共通イベントメソッド(ウ...

MySQL 8.0.20 圧縮版のインストールチュートリアル(画像とテキスト付き)

1. MySQL ダウンロード アドレス。 http://ftp.ntu.edu.tw/MySQL...

MySQL スロークエリログの設定と使用方法のチュートリアル

序文MySQL スロー クエリ ログは、日常業務でよく遭遇する機能です。MySQL スロー クエリ ...

Vue.jsはタイムライン機能を実装します

この記事では、タイムライン機能を実装するためのVue.jsの具体的なコードを参考までに共有します。具...

Dockerイメージのエクスポートとインポート操作

基本イメージが以前に構成されていて、これらのイメージが他の場所でも必要な場合はどうなりますか?回答:...

ネイティブ JavaScript を使用して計算機のサンプル コードを開発する

計算機の主な機能は数値計算を実行することです。計算機機能の Web インスタンスを開発すると、js ...

仮想マシン VMware に Kali Linux をインストールする最新の超詳細なグラフィック チュートリアル

目次1. システムイメージファイルをダウンロードする2. 新しい仮想マシンを作成する3. Kali ...

MySQLのnull値に関する小さな問題

今日、null 値をテストしていたところ、小さな問題が見つかりました。ここに記録しました。以前にも遭...

MySQL インデックスのクイックガイド

MySQL インデックスの確立は、MySQL の効率的な操作にとって非常に重要です。インデックスによ...

Linux で scp コマンドを使用してファイルをリモートでコピーする方法の詳細な説明

序文scp は secure copy の略です。scp は、Linux システムの ssh ログイ...

HTMLテキストの一般的なイベントとメソッドの詳細な説明

イベントの説明onactivate: オブジェクトがアクティブ要素として設定されたときに発生します。...

Ubuntu 20.04 に GitLab をインストールして設定する方法

導入GitLab CE または Community Edition は、主に Git リポジトリのホ...

Win10 での MySQL 5.7 の詳細なインストールと設定のチュートリアル

1. MySQL 5.7を解凍する2. 新しい設定ファイルmy.iniを作成し、 D:\Free\m...

ウェブサイトのビジュアルデザインパスはユーザーの習慣に合わせる必要がある

クーパー氏は、一般的に上から下、左から右に向かうユーザーの視覚経路について話しました。優れたビジュア...