はじめに 中級以上のJavaScriptプログラマを目指す上で、避けては通れない壁の一つは クロージャ（Closure） だと思います。「関数の外側で定義された変数を持つ関数の実行時オブジェクトです」とさらっと説明されることが多いですが、シンプルなだけに理解したつもりになって実は使いどころが分からないってことになりがちです。きちんと自分のものにするには基本から丁寧に理解しないとダメですねってことで、今回はクロージャについてその背景から調べてみたいと思います。 歴史と語源 まずは歴史から振り返ってみたいと思います。Wikipediaによるクロージャの解説では、以下のような説明があります。 クロージャの概念は、1960年代にラムダ計算の機械的な実行モデルを構築するために生み出され、1970年に 静的スコープ と 第一級関数 をサポートするPALプログラミング言語で最初に実装された。1964年、

設計を意識したコードが書けるようになる為に、デザインパターン修行しました。 他のDesign Patternもちょくちょく出していきます。 前置き 増補改訂版Java言語で学ぶデザインパターン入門をJavaからPythonにしてます。（Pythonは3.4.2） githubにコード置いてあります（まだ動かないものもある） デザインパターンをどういう時に、何を、どう使うのかを理解することが一先ずの目標。 （Javaというか静的型付言語は初めてで、且つpython歴もそんなに長くないので、Pythonistaぽっくないところがあると思います。ご指摘ございましたらご教授ください。） 今回は、構造に関するパターンFacadeパターン。 Facadeとは Facade（ファサード）は複雑なシステムに対するシンプルな窓口の役を果たす。つまり、大型のロジックを簡素化し、1つのシンプルな関数呼び出しにま

設計を意識したコードが書けるようになる為に、デザインパターン修行しました。 他のDesign Patternもちょくちょく出していきます。 前置き 増補改訂版Java言語で学ぶデザインパターン入門をJavaからPythonにしてます。（Pythonは3.4.2） githubにコード置いてあります（まだ動かないものもある） デザインパターンをどういう時に、何を、どう使うのかを理解することが一先ずの目標。 （Javaというか静的型付言語は初めてで、且つpython歴もそんなに長くないので、Pythonistaぽっくないところがあると思います。ご指摘ございましたらご教授ください。） 今回は、生成に関するパターンFactoryMethod。 FactoryMethodとは オブジェクト作成のインタフェースと、オブジェクト生成する役割りを分けて、他のクラスのコンストラクタをサブクラスで上書き可能な

設計を意識したコードが書けるようになる為に、デザインパターン修行しました。 他のDesign Patternもちょくちょく出していきます。 前置き 増補改訂版Java言語で学ぶデザインパターン入門をJavaからPythonにしてます。（Pythonは3.4.2） githubにコード置いてあります（まだ動かないものもある） デザインパターンをどういう時に、何を、どう使うのかを理解することが一先ずの目標。 （Javaというか静的型付言語は初めてで、且つpython歴もそんなに長くないので、Pythonistaぽっくないところがあると思います。ご指摘ございましたらご教授ください。） 今回は、振る舞いに関するパターンのTemplate Method。 Template Methodとは スーパークラスで処理の枠組みを定め、サブクラスでその具体的内容を定めるようなデザインパターン か。つまり、スー

設計を意識したコードが書けるようになる為に、デザインパターン修行しました。 他のDesign Patternもちょくちょく出していきます。 前置き 増補改訂版Java言語で学ぶデザインパターン入門をJavaからPythonにしてます。（Pythonは3.4.2） githubにコード置いてあります（まだ動かないものもある） デザインパターンをどういう時に、何を、どう使うのかを理解することが一先ずの目標。 （Javaというか静的型付言語は初めてで、且つpython歴もそんなに長くないので、Pythonistaぽっくないところがあると思います。ご指摘ございましたらご教授ください。） まず、そもそもデザインパターンってどういうものかってとこから。 デザインパターンとは ソフトウェア開発におけるデザインパターン（型紙（かたがみ）または設計パターン、英: design pattern）とは、過去のソ

はじめに# 今年の目標は, デザインパターンの攻略! ということで, この一年でまとめた情報や書いた記事のブックマークページです. 過去記事は, Ruby と Java が入り混じっていたり, 気まぐれでどんどん更新していったので, とてもまとまりがないとおもう. 強引に一つのページにまとめてみた感じ… (*‘д`*) 一年の振り返り# Rubyist になる# 去年の 12 月から Rubyist になった. Rubyist になった日 | Futurismo そして, オブジェクト指向開発に触れることになった. 楽しかったので, 何も考えずにデザインパターンを使ってみたりした. しかし, これはのちに後悔することになった. 保守性よりもスピードを重視するべきだったのに, デザインパターンをつかって, 仕事が遅れてしまったという悲しい思い出. POSA を学ぶ# coursera で P

まえおき デザインパターンに関しては色々言われていますね。 個人的には、「確かに微妙だし全体的に時代遅れっぽいけど基礎教養みたいなもんなので基本情報技術なんぞを受ける暇があるなら一通り目を通しておいてもいんじゃねえの？」っていう立場です。 微妙っぽい感じなものが多いデザインパターンなんですが、それでもちゃんと押さえておいた方がいいよねっていうものの一つがオブザーバーパターンです。 アプリケーション的なプログラミングをしていると絶対に避けて通れないパターンなんですけども、以外と存在も意味も知らずになんとなくとコピペで済ませている人に未だにめっちゃ出会うのでちょっとした危機感だよねっていうのが現状です。 このパターンはみんな大好きMVCの基礎となっている設計手法で、Webとかスマホアプリだとかをちゃんとやるには避けて通れないんだ。一切勉強もせずに聞きかじりの知識で「今さらデザパタの記事とかww

このブログでのデザインパターン連載も５回目になってやっと連載らしくなってきました。 引き続き今回はシングルトンパターンを紹介します。 シングルトンパターン オブジェクトのインスタンスの生成を1つに制限する、というのがシングルトンパターンです。 手軽に実装するには以下のようにオブジェクトリテラルを使用することで実装できます。 var Singleton = { prop: 1, another_prop: 'value', method: function() {…}, another_method: function() {…} }; しかし、これではプライベート・パブリックの区別ができません。全てのプロパティ、メソッドにアクセスできてしまいます。 シングルトンパターンの常套手段としては、インスタンスが作成されていなかったら作成し、すでに作成されている場合はそのインスタンスを返します。 サ

今回はリビーリングモジュールパターンを紹介します。 リビーリングモジュールパターン このパターンはクリスチャン・ヘイルマンという人による、モジュールパターンを改良したパターンです。 全ての関数と変数をプライベートスコープ内で定義し、パブリックメンバとして公開したいプライベートメンバへのポインタを持つ無名オブジェクトを返します。 var myRevealingModule = function() { var privateVar = 'Hoge', publicVar = 'Foo'; function privateFunction() { console.log('Name:' + privateVar); } function publicSetName(strName) { privateName = strName; } function publicGetName() { pr

前回はコンストラクタパターンについて紹介しました。 今回はモジュールパターンについて紹介します。 モジュールパターン 従来のJavascript以外でのモジュールパターンというのは、クラスにパブリックとプライベートの両方のカプセル化をもたらす方法でした。 しかし、前回Javascriptにはクラスの概念が無いということを書きました。 Javascriptではクラスのような実装をモジュールパターンで再現することができます。 モジュールパターンを使用することで、1つのオブジェクトにパブリック・プライベートなメソッドや変数を取り込み、グローバルから特定の部分を隠蔽できます。 グローバル空間での変数名や関数名の衝突がしづらくなるわけです。 モジュールパターンでは、クロージャを使い変数やメソッドの隠蔽を実現します。 var testModule = (function() { // カウンタ変数 v

前回は第1回目ということで、そもそもデザインパターンとはなんぞや？という話に触れました。 今回から具体的なデザインパターンについて紹介していきます。 コンストラクタパターン コンストラクタ（Constructor）とはオブジェクトを作成し、初期化する関数のことです。 コンストラクタはJavascript以外の言語では「クラス」と呼ばれています。 プロトタイプベースの言語であるJavascriptでは、クラスの概念がありませんが、コンストラクタを作成することでクラスに似たオブジェクトを作成することができます。 コンストラクタは、オブジェクトを使用するための準備を行い、引数を受け取りオブジェクトの初回作成時にメンバのプロパティやメソッドに値を設定するのに利用します。 // コンストラクタを定義する function Person(name, age) { this.name = name; t

本シリーズは、構想段階ではデザインパターンを淡々と列挙していく記事にしようと思っていたが、なかなかまとまらないので、備忘録ついでに今考えていることをそのまま投稿してしまうことにした。 （訳：いきあたりばったりで体系的ではありません。） ## 出来ればそのうち整理しよう…。 ※ JSの知識には自信ないので間違った点に気付いた方がいらしたらコメント等でご指摘いただけると助かります。 ※ 本稿は直接的な「デザインパターン」についてはあまり焦点があたっていないのでご了承ください。 ０．はじめに 本編案内 Moduleパターンを利用したアクセス制御について紹介する。 本編を通して、JSにおけるアクセス制御の一例を見てみる。 シリーズ案内 Javaプログラマから見たJavaScriptデザインパターン(導入編) 本シリーズの前提条件及びModule、Singleton、FactoryMethodパター

仕事などでJSを書くようになって少々経つが、Java信者で頭が固い僕にとってはどうもJSというのは柔らかすぎてしっくりこない部分が多い。 考え方を整理するにはデザインパターンを知るのが早いと、最近思い立ったので改めて調べてみた。 ということで、Javaは大体分かるし、JSも書くけどそこまで詳しくない人向け（つまり自分主体）にまとめておく。 今のところシリーズ化予定。 ※ JSの知識には自信ないので間違った点に気付いた方がいらしたらコメント等でご指摘いただけると助かります。 ※ デザインパターンとして挙げているコードは、個人的にアレンジしている場合がありますので、ご了承ください。 ０．はじめに 本編案内 内容に入る前に、予備知識をおさらい。要点ではないのでざっくり。 シリーズ案内 Javaプログラマから見たJavaScriptデザインパターン(導入編) Javaプログラマから見たJavaSc

昔Qiitaで書いた内容なんですが、PHPのswitch文は悪名高い「==」演算子で比較を行います。 <?php switch (true) { case 0: echo '数字の0'; break; case '0': echo '文字列の0'; break; case '0.0': echo '文字列の0.0'; break; case true: echo '真偽値のtrue'; break; } このコードは「文字列の0.0」を出力します。大変分かりにくいですね。 この点はif ... elseif ...を使えば解決するんですが、switchで書きたくなるようなコードをelseifにするとおそらく読みにくくなるでしょう。 ではどうするか。 正解はオブジェクトのポリモーフィズム(多態性)機能を使うことです。 といっても、多態性で調べて出てくる記事とか書籍に関しては抽象的な説明が多い

前回はReveling Module Patternについて書きました。JavaScriptでもprivateとpublicの領域を明快に分けられるという利点がありましたが、複数のインスタンスを作る際に、privateな関数もpublicな関数ももろもろが複製されるので、あまり効率が良くなさそうというのが懸念でした。 そこで、その点を補ったのがReveling Prototype Pattern（リビーリングプロトタイプパターン）ということで、紹介記事を読んで試してみました。 Revealing Prototype Pattern - Techniques, Strategies and Patterns for Structuring JavaScript Code - Dan Wahlin Revealing Prototype Patternによるオブジェクトの作り方 //最初にコン

これまで業務ではJavaScriptを場当たり的にコーディングしてきたので、今年は基本的なところから見直そうと思っています。JavaScriptの実装でいつもに気になっていたのがオブジェクトの生成で、どういった書き方が定石なのか、本で調べてもネットで調べてもいろいろ意見があって悩ましいところでした。 その中で、良さそうと思ったのが『JavaScriptデザインパターン』の中でも紹介されている「リビーリングモジュールパターン(Revealing Module Pattern)」です。 JavaScriptデザインパターン 作者: Addy Osmani,豊福剛,サイフォン合同会社出版社/メーカー: オライリージャパン発売日: 2013/05/25メディア: 大型本この商品を含むブログ (6件) を見る Revealing Module Patternによるオブジェクトの作り方 『JavaSc

jsを書くとき、今まであまりprototype継承を使用せず、どちらかというとモジュールパターンで記述することが多かったので、それぞれ何が違うのか、あまり理解していませんでした。 それを今日教えてもらえたので、まとめます。 モジュールパターンとは function Hoge() { var n = 1; return { fuga: function() { alert(n); } }; } var hoge = new Hoge; hoge.fuga(); // 「1」がalertで表示される hoge.n; // Error このように、関数の返り値をobjectで返し、さらにそのobjectの中にfunctionを用意します。 fugaの中で参照しているnはクロージャの中で生き続けるので、外からでもアクセスできますが、直接は参照できません。 この、クロージャを利用してprivateや