Practical Common Lispの著者であるPeter Seibelは、かつてパターンが必要な場合は何かが間違っているに違いないと言いました。彼が言及した問題は、言語の固有の欠陥のために、一般的な解決策を求めて要約する必要性を指します。
弱い型または強いタイプ、静的または動的言語、命令的または説明的な言語であろうと、各言語には独自の利点と短所があります。ジャマイカのアスリートには、疾走やボクシングさえもいくつかの利点がありますが、ヨガの練習にはいくつかはありません。
ウォーロックとシャドウの司祭は簡単に優れた補助になることができますが、敵の魔法は彼の背中にメーコンをつけて飛び回るのは少し厄介です。プログラムに切り替えるには、静的言語でデコレーターを実装するのに多くの努力が必要な場合があります。 JSはいつでもオブジェクトにメソッドを投げることができるため、DecoratorパターンはJSでは役に立たなくなります。
JavaScriptのデザインパターンに関する本がかなりあります。 「Pro javascriptのデザインパターン」は古典的な本ですが、その例は非常に冗長です。したがって、私が職場で書いたコードに基づいて、私の理解を要約します。私の理解が偏っている場合は、必ず修正してください。
1。シングルトンモード
シングルトンパターンの定義は、クラスのユニークなインスタンスを作成することですが、JS自体は「クラスレス」言語です。 JSデザインパターンについて話している多くの記事は、{}をシングルトンとして使用し、理にかなっています。 JSによってオブジェクトを生成する方法はたくさんあるので、別のより意味のあるシングルトンを見てみましょう。
ボタンをクリックすると、マスクレイヤーがページにポップアップする必要があるという一般的な要件があります。たとえば、Web.QQ.comをクリックしてログインします。
灰色の背景マスクレイヤーを生成するこのコードは簡単に書き込みます。
コードコピーは次のとおりです。
var createmask = function（）{
return document、body.appendchild（document.createelement（div））;
}
$（ 'button'）.click（function（）{
var mask = createmask（）;
mask.show（）;
}）
問題は、このマスクレイヤーがグローバルに一意であるため、CreateMaskを呼び出すたびに新しいDIVが作成されますが、マスクレイヤーを隠す際に削除できます。しかし、これを行うことは明らかに不合理です。
2番目のソリューションを見て、ページの先頭にこのDIVを作成します。次に、変数でそれを参照してください。
コードコピーは次のとおりです。
var mask = document.body.appendChild（document.createElement（ "div '））;
$（ "button '）.click（function（）{
mask.show（）;
}）
これは、マスクレイヤーdivのみがページに作成されることを意味するものではなく、別の問題が続きます。たぶん、私たちはこのマスク層を必要としないでしょう。
変数を使用できる場合、Divが作成されたかどうかを判断しますか？
コードコピーは次のとおりです。
var mask;
var createmask = function（）{
（マスク）マスクを返します。
それ以外{
mask = document、body.appendchild（document.createelement（div））;
マスクを返します。
}
}
見た目は良さそうですが、ここでは、単一の列オブジェクトを生成する関数を完了しました。このコードの何が問題なのかを詳しく見てみましょう。
まず、この関数には特定の副作用があります。関数は、関数本文の外部変数マスクへの参照を変更します。複数人のコラボレーションプロジェクトでは、CreateMaskは安全でない機能です。一方、グローバル変数マスクは必要ではありません。それを改善しましょう。
コードコピーは次のとおりです。
var createmask = function（）{
var mask;
return function（）{
マスクを返します|| （mask = document.body.appendchild（document.createelement（ 'div'）））
}
}（）
少なくともcreatemask関数では、可変マスクをラップするために簡単な閉鎖を使用して、閉じます。
たぶん私がこれを見たとき、私はシングルトンのパターンがあまりにも単純だと思います。実際、いくつかのデザインパターンは非常に単純です。デザインパターンの概念に注意を払ったことがなくても、私はそれを知らずに毎日のコードにいくつかのデザインパターンを使用しました。老人のカートが何であるかを理解したときと同じように、私は何年も前にそれについて考えました、それはこれが老人のカートであることが判明しました。
GOFの23の設計パターンは、ソフトウェア開発で繰り返し使用され、繰り返し使用されたパターンでもあります。プログラマが特定のパターンを使用していることを明確に認識していない場合、次回はより適切なデザインを逃す可能性があります（このパッセージは「松本のプログラミングの世界」から来ています。
トピックに戻りましょう。以前のシングルトンにはまだ欠点があります。マスクレイヤーの作成にのみ使用できます。一意のXHRオブジェクトを作成するために関数を記述する必要がある場合はどうなりますか？一般的なシングルトンラッパーを見つけることができますか？
JSの関数は最初のタイプです。つまり、関数をパラメーターとして渡すこともできます。最終コードを見てみましょう。
コードコピーは次のとおりです。
var singleton = function（fn）{
var結果;
return function（）{
結果の結果|| （result = fn .apply（this、arguments））;
}
}
var createmask = singleton（function（）{
document.body.appendChild（document.createElement（ 'div'））を返します。
}）
変数を使用して、最初の返品値を保存します。割り当てられている場合、変数は後続の呼び出しで最初に返されます。マスクレイヤーを実際に作成するコードは、コールバック関数を介してシングルトンラッパーに渡されます。この方法は、実際にはブリッジモードと呼ばれます。ブリッジモードに関しては、少し後に置かれます。
ただし、Singleton関数は完全ではなく、Divへの参照を登録するために常に変数の結果が必要です。残念ながら、JSの機能的特性は、宣言と声明を完全に排除するのに十分ではありません。