Ajaxアプリケーションの開発においてprototype.jsを使用すると様々な恩恵をえられる。

私自身も話題のJQueryよりもPrototype.jsを使用する機会の方が多いのだが、よく言われるように、配列やオブジェクトの汚染にも悩まされることが多い。

prototype.jsを使用していない場合の配列、連想配列、オブジェクトの初期化

prototype.jsを使用していない場合は、以下のように初期化することが一般的である。

var array = new Array(); // 配列の初期化
var hash = new Array(); // 連想配列の初期化
var obj = new Object(); // オブジェクトの初期化

prototype.jsを使用していない場合この方法で何も問題は生じないが、prototype.jsを使用するとループで処理した際などに意図していない値が出力されてしまうことがある。

これが、よくいわれるprototype.jsによる汚染である。

prototype.jsを使用した場合の初期化

上記のような汚染を免れる場合には以下のように初期化する必要がある。

var array = []; // 配列の初期化
var hash = {}; // 連想配列の初期化
var obj = {}; // オブジェクトの初期化

上記の例で注意する必要があるのは、連想配列である。

通常の場合、連想配列は配列と同じようにnew Array()とすればよいので、prototype.jsを使用する場合でも、hash = [];としてしまいがちだが、この方法では実際には汚染されてしまうので注意。

JavaScriptでは、連想配列とオブジェクトは同じ扱いであり、たとえばfoo.barという値にはfoo[bar]という方法でもアクセスできる。

そんなわけで、prototype.jsを使用する場合には、連想配列もオブジェクトとして初期化する必要がある。

ちなみに連想配列またはオブジェクトをループで処理する場合は以下のような感じ

for (var i in hash) {
  alert(hash[i]);
}

簡単なサンプルなので分かりにくいかもしれないが、iにはプロパティ名(連想配列で言えばキー)が、hash[i]には値が格納されている。