JavaScriptのデザインパターン-第1章

🤓 導入
このブログでは、JavaScriptプログラミング言語を使用してデザインパターンを理解するのをお手伝いします.私はあなたに、パターンが何であるかを説明しようとします、どのように我々はパターンを使用しますか、彼らの構造とは何ですか.

だめだ!私にすべてのマイケルスコットを行かないでください!すべては素晴らしいです、私は私の言葉に固執して、それを短くて、甘くて、単純にしておきます.そのために、私はそれをシリーズと呼ぶ🎉 デザインパターンシリーズ.🎉 ……ちょっと一般的だけど..🤷‍♂️)

▶ 始めましょう
維持可能なコードを書く際の最も重要な側面の1つは、そのコードの再帰的な構造と機能性に気づき、それらを最適化することです.デザインパターンが提供する知識は、維持可能なコードを書くときに非常に貴重です.
デザインパターンの父はChristopher Wolfgang Alexander , 広く影響力のある英米の建築家とデザイン理論家、現在カリフォルニア大学バークレー校名誉教授.

🙄 パターンとは
パターンは、ソフトウェア設計において一般的に発生する問題に適用できる再利用可能な解を表す.我々は簡素化することができますし、パターンの問題を解決するためのテンプレートを表すと言うことができる

💡 Practical wisdom moment: Software Engineering is a problem-solving discipline!

デザインパターンを使用する理由?

パターンは、ソリューションを証明されています:彼らは、経験を反映した実証的なソリューションを使用してソフトウェア開発の問題を解決するための固体のアプローチを提供し、それらを定義し、それらを改善するのに役立つ開発者の洞察パターンをもたらす.

パターンを簡単に再利用することができます:パターンは通常、自分のニーズに合わせて適応することができますボックスの解決策を反映しています.この機能は非常に堅牢になります.

パターンを表現することができます:パターンを見たとき一般的に設定された構造であり、したがって、かなりの優雅にかなり大きなソリューションを表現することができますソリューションに提示される“語彙”と言うために.

パターンは一般的な解決を提供し、マイナーな問題がアプリケーション開発プロセスで大きな問題を引き起こすのを防ぐことができます.デザインパターンは、しばしば開発者の語彙を追加しながら、ファイルサイズのフットプリントを減らすことができます.

反復現象
パターンの追加要件の一つは、それが定期的な現象であることを証明することです.これはしばしば3つのルールと呼ばれる少なくとも3つの重要な分野で修飾できるものです.

目的のフィットネス-成功したと考えられるパターンは、どうですか

有用性-なぜ成功したか

適用性-デザインがより広い適用性を有するので、デザインはパターンであるにふさわしいですか

# 🏗 デザインパターン構造
パターンは、

文脈

その文脈で起こる力のシステム

これらの力が文脈で自分自身を解決できるようにする設定

デザインパターン成分

パターン名

コンテキストアウトライン-パターンがユーザーのニーズに応じて効果的である文脈

問題文-我々はパターンの意図を理解できるように対処されている問題のステートメント

解決策-ステップと知覚の理解できるリストでユーザーの問題が解決されている方法の説明

デザイン

実装-パターンがどのように実装されるかについてのガイド

イラスト-パターンのクラスのビジュアル表現

例-最小形式でのパターンの実装

他のパターンが記述されているパターンの使用を支持するのに必要であるかもしれません

関係

既知使用量

議論

🏷 デザインパターンのカテゴリー

クリエイティブデザインパターン
創造的なデザインパターンは、オブジェクトがあなたが働いている状況にふさわしい方法でつくられるオブジェクト創造メカニズムを取り扱うことに集中します.このカテゴリのパターンは以下の通りです.

コンストラクタ

ファクトリー

抄録

プロトタイプ

シングルトン

ビルダー

構造設計パターン
構造パターンは、オブジェクトの構成に関係しており、典型的には単純である
異なるオブジェクト間の関係を実現する方法システムの一部が変更されるとき、システム全体の構造が同じことをする必要がないことを確実にする.このカテゴリのパターンは以下の通りです.

デコレータ

ファサード

フライ級

アダプタ

プロキシ

行動設計パターン
行動パターンは、間のコミュニケーションを改善するか、合理化することに集中します
システム内のさまざまなオブジェクト.いくつかの行動パターンを含める

イテレータ

メディエータ

観測者

訪問者

コンストラクタパターン
あなたが既にJavaScript MAGEであるならば🧙‍♂️, おそらくコンストラクタに慣れているでしょう.コンストラクタは、特定の種類のオブジェクトを作成するために使用されます.コンストラクターは、使用するオブジェクトを準備し、コンストラクターがオブジェクトが最初に作成されたときにメンバー変数の値を設定するパラメーターを受け入れます.

🛑 IMPORTANT: In JavaScript, there are no classes in the class-based OOP sense of the word. JavaScript works with objects. If you want to encapsulate a few functions and properties together, you would create an object containing functions and properties, and not a class.

JavaScriptでは、コンストラクタ関数は一般的にインスタンスを実装する合理的な方法と見なされます.以前に見たように、JavaScriptはクラスの概念をサポートしていませんが、特別なコンストラクタ関数をサポートしています.単に「new」というキーワードを持つコンストラクタ関数への呼び出しを事前に固定することによって、JavaScriptを伝えることができます.JavaScriptでは、コンストラクタのように振舞うことができ、新しいオブジェクトをインスタンス化することができます.
コンストラクタパターンの最も簡単なバージョン.

function SuperHero(name, superPower, age, height, weight){
   this.that = this; //these are member variables
   this.name = name;
   this.superPower= superPower;
   this.age = age;
   this.height = height;
   this.weight = weight;
}

//A prototype function that prints out data about our 🦸‍♂️
SuperHero.prototype.getSuperHero= function(){
     return "Superhero stats: name="+this.name+", super power="+this.superPower
     +",age="+this.age+", height="+this.height+" feet, weight="+this.weight+" pounds";
}

//Instantiating objects with new keyword, and passing data to our SuperHero //constructor
var IronMan = new SuperHero('Tony Stark', 'Genious, Playboy, Philantropist', 30, 6, 225);
var Hulk = new SuperHero('Bruce Banner', 'Green scary monster', 30, 8, 1400);

console.log(IronMan.getSuperHero());
console.log(Hulk.getSuperHero());

同じことを実装するES 6クラスを作成しましょう.

//syntactic sugar on top of the prototype-based programming model
class SuperHero{
   constructor(name, superPower, age, height, weight){ //"classes constructor
     this.that = this; //these are member variables
     this.name = name;
     this.superPower= superPower;
     this.age = age;
     this.height = height;
     this.weight = weight;
   }

   //a "class" member function that prints out data about our 🦸‍♂️
   getSuperHero(){
      return "Superhero stats: name="+this.name+", super power="+this.superPower
     +",age="+this.age+", height="+this.height+" feet, weight="+this.weight+" pounds";
   }   
}

//Instantiating objects with new keyword, and passing data to the constructor of
//our superhero "class"
const IronMan =new SuperHero('Tony Stark', 'Genious, Playboy, Philantropist', 30, 6, 225);
const Hulk = new SuperHero('Bruce Banner', 'Green scary monster', 30, 8, 1400);

console.log(IronMan.getSuperHero());
console.log(Hulk.getSuperHero());

これは、コンストラクタパターンを使用して実装する方法です.
次の章では、ユニークな小さな仲間について議論します.

📝 概要

パターンは、ソフトウェア設計において一般的に発生する問題に適用できる再利用可能な解を表す.

パターンは一般的な解決を提供し、マイナーな問題がアプリケーション開発プロセスで大きな問題を引き起こすのを防ぐことができます.

JavaScriptでは、クラスのクラスのOOPセンスのクラスがありません.JavaScriptはオブジェクトで動作します.

コンストラクタは、特定の種類のオブジェクトを作成するために使用されます.コンストラクタは、使用するオブジェクトを準備し、コンストラクタがオブジェクトが最初に作成されたときにメンバー変数の値を設定するために使用する**パラメータを受け取ります**

🙏 読んでくれてありがとう!
コメントを残してください、あなたについて、あなたの仕事について教えてください、あなたの考えをコメントし、私と接続するか、または.
今年は今年、今年は今年をさせてください.次の入力まで.
楽しい時間を!
☕ 私をサポートし、私を集中保つ!

😊