JavaScript

JavaScriptでグローバル変数を減らす方法

js_global

グローバル変数はいいことない!
もしかしたら使っているライブラリーと変数名がかぶってしまうかもしれないし、できるなら使いたくないです。

とはいえ使わないとなにもできません。

個人的に使っている方法として
グローバル変数を減らすために以下のように
するのがオススメです。

1
2
3
4
5
6
7
8
9
//グローバル変数を定義
var GL = {};
 
//「.」で変数を定義。
//もういろいろ作れます。
//普通の変数みたいな扱いでイケます。
GL.qcount = 0;
GL.pattern = 0;
GL.stage = 0;

ひとつのグローバル変数を定義して
それに変数を追加していくと、
結果としてひとつのグローバル変数で
いろいろできるようになります。

他にも以下のように
なんでも放り込めてしまいます。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
GL.count = 
    {
        count: 0,
        name: hoge,
        tel: 080-0000-0000
    }
 
GL.book = [
    { 
        p6x: '272px',
        p6y: '199px'
    },
    { 
        p6x: '300px',
        p6y: '230px'
    },
    { 
        p6x: '50px',
        p6y: '100px'
    },
];

実は同じようなことを以下の記述でもできます。

1
2
3
4
5
//以下と同じこと
GL['qcount'] = 0;
 
//上と同じこと
GL.qcount = 0;

[ ]を使うときは以下のように動的に
変数名を変更したいときに有効です。

1
2
3
4
5
6
7
8
9
10
11
//初期化
for (var i=0; i<5; i++){
    GL['qcount' + i] = 0;
}
 
//のfor文は以下と同じ
GL['qcount0'] = 0;
GL['qcount1'] = 0;
GL['qcount2'] = 0;
GL['qcount3'] = 0;
GL['qcount4'] = 0;

グローバル変数を減らして
堅牢なコードを目指したいですね。

関連記事

  1. JavaScript

    【TweenMax.js】回転アニメーションも楽々!

    以前も記事に書いたアニメーション用のJavaScriptライブラリ…

  2. JavaScript

    「TweenMax.js」をビジネス利用のためのライセンス購入方法

    いつもJavaScriptのアニメーション部分でお世話になってる「…

  3. JavaScript

    背景画像をJavaScriptで入れ替える2種類の方法

    ものごとには「正解」というものがひとつではない、ってことが多いもん…

  4. JavaScript

    強力なアニメーション用のJavaScriptライブラリー「TweenMax.js」が便利!

    jQueryでもアニメーションはできるのですが、それよりも表現力豊…

  5. JavaScript

    JavaScriptでコメントは「/* */」をなるべく使わないようにしたい

    コメントには囲った部分をすべてコメントにする「/* */」と、1…

最近の記事

  1. ホワイトハウスコックスの財布
  2. 進撃の巨人展FINAL チラシ
  3. 【無印良品】ゴールデンウィーク中のご飯にレトルト買い込み!
  4. 世代ど真ん中だった!!『週刊少年ジャンプ展 vol2』
  5. デジタル通貨を買ってみた記録!とりあえず元は取っている!
  6. 【コレクション】カードダス:SDガンダム外伝シリーズ
  7. 懐かしい!!カードダスSD戦国伝!!

アーカイブ

  1. 日常

    カゼでダウン?
  2. 【無印良品】背も低くて実用的!無印良品のフタ付きバケツ

    無印良品

    【無印良品】背も低くて実用的!無印良品のフタ付きバケツ
  3. 日常

    銀座で
  4. 日常

    「解る&判る&分かる文字組版」
  5. LEGO

    世界にひとつのオリジナル・ミニフィグが届いた!
PAGE TOP