TOP＞システム開発＞ グローバル変数の汚染を防ぐ方法




まるごとJavaScript&Ajax!
JSライブラリ・ラボ - これで君もライブラリ開発者だ！

第５回：グローバル変数の制御と更新履歴ファイル
 著者：川崎 有亮   2007/4/9
1   2  次のページ
グローバル変数の汚染を防ぐ方法

   前回の「第4回：JavaScriptライブラリの作成」で作成したCalcライブラリでは、オブジェクトの初期化で特に複雑な処理は不要でしたが、より高度なライブラリになると多数の関数を定義したりループを回したりと、初期化処理の中で変数を必要になるシーンが増えてきます。

   JavaScriptの変数スコープは「{}」で囲われたブロック単位でなく、関数単位になります。関数外でvar宣言した変数も全てグローバル変数として定義されるため、例えばライブラリ中で
リスト5：calc.cgiサンプルCGI（Webサービス側）
{
   var tmp = 0;
   for( var i=0; i<10; i++ ) {
   // などなど、初期化処理を行う
   }
}

   という初期化コードを記述した場合、tmpとiの2つのグローバル変数を利用（汚染）することになります。

   ライブラリは他のプログラムと併せて利用するためのものですから、ライブラリ外のプログラムが変数tmpやiを別の用途で利用していた場合に影響が出てしまう可能性があります。

   ライブラリの初期化処理中で変数を利用する際にも、無用にグローバル変数を利用して他のプログラムに影響を与えないように、ライブラリ側で配慮しておく必要があります。

   そこでJavaScriptでグローバル変数を汚染せずに初期化処理を行う場合には、無名関数を定義してその場で実行する手法が多く利用されています。

(function(){
   var tmp = 0;
   for( var i=0; i<10; i++ ) {
   // などなど、初期化処理を行う
   }
})();

   このコードは、初めは少しわかりにくいかもしれませんが、まず「(function(){ 〜 })」の部分が無名関数の定義になります。その直後に再びカッコ()が置かれているため、定義した無名関数がその場で実行されるというトリックです。

   この場合、関数の中でvar宣言しているので、関数内で変数tmpやiをいくら書き換えても、グローバル変数には影響がありません。名前のない関数を作成してその場で実行することで、変数スコープの問題を回避しています。

   また、別の手法としては、無名オブジェクトを利用する手法もあります。

new function(){
   var tmp = 0;
   for( var i=0; i<10; i++ ) {
   // などなど、初期化処理を行う
   }
};

   こちらも変数スコープが関数内となり、同様の効果が得られます。まず「function(){ 〜 }」で無名関数としてオブジェクトのコンストラクタメソッドを定義し、その直前のnewによりインスタンス生成することで、その場で無名関数内のコードが実行されるトリックです。

   カッコ()の個数が削減できて見た目にも分かりやすく、単純にコードブロック{}の冒頭にオマジナイとして「new function()」を付けるだけでグローバル変数の汚染を防げるので、お手軽ですね。
1   2  次のページ
書籍紹介
まるごとJavaScript&Ajax!

 まるごとJavaScript&Ajax! Vol.1 JavaScriptの一人者たちが教える最新ノウハウ
Ajaxの登場により、JavaScriptは最もホットなプログラミング言語になりました。そのJavaScriptとAjaxについて、最新ノウハウをまるごと解説します。
今や欠かせない、Prototype.jsをはじめとするJavaScriptライブラリを紹介します。IE 7やFirefox 2などの最新ブラウザーの新機能と、来るべきJavaScript 2についてもわかります。Web以外でのJavaScriptの利用テクニックも読めます。
JavaScriptを知り尽くした第一人者たちに学ぼう！

発売日：2007.02.16発売
定価：1,995円 (税込)
川崎 有亮
 著者プロフィール
川崎 有亮
1977年東京生まれ。AjaxなどWeb技術のアーキテクト。株式会社かっぺを経て、現在は株式会社リクルート事業開発室に所属。技術評論社「Ajax／実装のための基礎テクニック」（共著）など書籍・雑誌記事の執筆も多数。

Kawa.net xp：http://www.kawa.net/
この記事の評価をお聞かせください
 ボタンをクリックしますとウインドウが開きます。
 ご意見、ご要望にお応えします！ インプレスIT INSIDE
INDEX
第5回：グローバル変数の制御と更新履歴ファイル
グローバル変数の汚染を防ぐ方法
  更新履歴ファイルChangeLogを書こう
JSライブラリ・ラボ - これで君もライブラリ開発者だ！
第1回 Prototypeライブラリの内部
第2回 jQueryライブラリの内部とonloadイベント記法
第3回 YUIライブラリと外部JSの呼び出し手法
第4回 JavaScriptライブラリの作成
第5回 グローバル変数の制御と更新履歴ファイル
第6回 自作ライブラリの公開とJavaScriptライブラリの今後

Think IT 過去人気記事

Think IT
注目おすすめ情報

Think IT人気ライター BEST 5

People
IT製品/サービス資料ダウンロード
    おすすめのホワイトペーパー情報を準備中です