ステップアップのためのJavascriptデザインパターン入門（５） 【シングルトンパターン】
このブログでのデザインパターン連載も５回目になってやっと連載らしくなってきました。 引き続き今回はシングルトンパターンを紹介します。 シングルトンパターン オブジェクトのインスタンスの生成を1つに制限する、というのがシングルトンパターンです。 手軽に実装するには以下のようにオブジェクトリテラルを使用することで実装できます。 var Singleton = { prop: 1, another_prop: 'value', method: function() {…}, another_method: function() {…} }; しかし、これではプライベート・パブリックの区別ができません。全てのプロパティ、メソッドにアクセスできてしまいます。 シングルトンパターンの常套手段としては、インスタンスが作成されていなかったら作成し、すでに作成されている場合はそのインスタンスを返します。 サ
ステップアップのためのJavascriptデザインパターン入門（４） 【リビーリングモジュールパターン】
今回はリビーリングモジュールパターンを紹介します。 リビーリングモジュールパターン このパターンはクリスチャン・ヘイルマンという人による、モジュールパターンを改良したパターンです。 全ての関数と変数をプライベートスコープ内で定義し、パブリックメンバとして公開したいプライベートメンバへのポインタを持つ無名オブジェクトを返します。 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にはクラスの概念が無いということを書きました。 Javascriptではクラスのような実装をモジュールパターンで再現することができます。 モジュールパターンを使用することで、1つのオブジェクトにパブリック・プライベートなメソッドや変数を取り込み、グローバルから特定の部分を隠蔽できます。 グローバル空間での変数名や関数名の衝突がしづらくなるわけです。 モジュールパターンでは、クロージャを使い変数やメソッドの隠蔽を実現します。 var testModule = (function() { // カウンタ変数 v
ステップアップのためのJavascriptデザインパターン入門（２） 【コンストラクタパターン】
前回は第1回目ということで、そもそもデザインパターンとはなんぞや？という話に触れました。 今回から具体的なデザインパターンについて紹介していきます。 コンストラクタパターン コンストラクタ（Constructor）とはオブジェクトを作成し、初期化する関数のことです。 コンストラクタはJavascript以外の言語では「クラス」と呼ばれています。 プロトタイプベースの言語であるJavascriptでは、クラスの概念がありませんが、コンストラクタを作成することでクラスに似たオブジェクトを作成することができます。 コンストラクタは、オブジェクトを使用するための準備を行い、引数を受け取りオブジェクトの初回作成時にメンバのプロパティやメソッドに値を設定するのに利用します。 // コンストラクタを定義する function Person(name, age) { this.name = name; t
最近のDOMの取得について整理してみた
自分は普段からJavascriptを書く機会が多いのですが、Webサイト構築ではDOMを扱うことがほとんどです。 最近はjQueryなどのライブラリを利用する方が多いのではないでしょうか。 今回はDOMを取得する際のパフォーマンスに着眼して、今一度整理してみたいと思います。 とりあえずテストしてみた JSPerfで要素を取得するメソッドをそれぞれ追加しました。 basic DOM selector test | JSPerf そして、自分の所持している PC , SP の各ブラウザからRUNボタンをポチポチ押します。 テスト項目 テスト項目は以下の通りです。 ピュアなJSでの取得とjQueryでの取得を選択しています。 getElementById getElementsByTagName getElementsByClassName querySelector querySelector
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
