JavaScriptの配列(Array)オブジェクトを考えてみた。
kame46 です。
(書き出しで近況を語るのって「笑●」みたいですよね。)
先日、同じチームのikedaさんが、「prototype.js でチェックされて…(略)」という記事を書いていますが…
僕も JavaScript ネタに乗っかって、配列オブジェクトについての記事を書いてみたいと思います。
ご存知の方も多いとは思いますが、JavaScript の配列って、いろんな書き方ができるんです。
// こーいうのとか(その1) var hoge1_array = new Array("hoge1", "hoge2", "hoge3"); // こーいうのとか(その2) var hoge2_array = ["hoge1", "hoge2", "hoge3"]; // こーいうのとか(その3) var hoge3_array = new Array(); hoge3_array.push("hoge1"); hoge3_array.push("hoge2"); hoge3_array.push("hoge3");
それぞれに、好みとか、動作速度とか、ブラウザの対応状況とか、いろんな事情があると思いますが…
個人的には、「その3」の push メソッドを使うのが一番好きです。
というのも、実際に配列を扱う時って、上の例みたいに、3個やそこらの要素で済まないはずだから。
「その1」や「その2」で、20個とか30個とか要素を入れようと思ったら、すごく横に長くなりそうですしね。
例えば、「その3」パターンで 連想配列 を記述した場合、こんな感じで書いたりしてます。
// スタッフの情報を持つ配列 (中身は架空の情報です) var staff_array = new Array(); staff_array.push({name:"佐藤", sex:"男", age:"25歳", blood:"A型"}); staff_array.push({name:"鈴木", sex:"女", age:"26歳", blood:"B型"}); staff_array.push({name:"高橋", sex:"男", age:"27歳", blood:"O型"}); staff_array.push({name:"田中", sex:"女", age:"28歳", blood:"AB型"}); staff_array.push({name:"渡辺", sex:"男", age:"29歳", blood:"A型"}); staff_array.push({name:"伊藤", sex:"女", age:"30歳", blood:"B型"}); staff_array.push({name:"山本", sex:"男", age:"29歳", blood:"O型"}); staff_array.push({name:"中村", sex:"女", age:"28歳", blood:"AB型"}); staff_array.push({name:"小林", sex:"男", age:"27歳", blood:"A型"}); staff_array.push({name:"加藤", sex:"女", age:"26歳", blood:"B型"}); // prototype.js の each メソッドを使って、それぞれの要素のプロパティを取り出す。 staff_array.each(function(staff){ document.write("名前:" + staff.name + " / "); document.write("性別:" + staff.sex + " / "); document.write("年齢:" + staff.age + " / "); document.write("血液型:" + staff.blood + "\n"); });
動作速度とか、ブラウザの対応状況とかを考えなければ、可読性は高いのでは? と思ってますが…
たぶん、もっと素晴らしい書き方もあると思います。
というわけで、今回はこの位にしておきます。
ディスカッション
コメント一覧
JavaScriptには構造体が無いので,こういうことをするとメモリを浪費してしまいます(SafariのJITコンパイラなどは最適化してくれますが).
以下はオススメの書き方(タブがズレるかもです…).
var employees = [
// NAME SEX AGE BLOOD_TYPE
[“佐藤”, “男”, “25歳”, “A型”],
[“鈴木”, “女”, “26歳”, “B型”],
[“高橋”, “男”, “27歳”, “O型”],
[“田中”, “女”, “28歳”, “AB型”],
[“渡辺”, “男”, “29歳”, “A型”],
[“伊藤”, “女”, “30歳”, “B型”],
[“山本”, “男”, “29歳”, “O型”],
[“中村”, “女”, “28歳”, “AB型”],
[“小林”, “男”, “27歳”, “A型”],
[“加藤”, “女”, “26歳”, “B型”]
];
var NAME = 0, SEX = 1, AGE = 2, BLOOD_TYPE = 3;
staff_array.each(function(employee) {
document.write(“名前:” + employee[NAME] + ” / “);
document.write(“性別:” + employee[SEX] + ” / “);
document.write(“年齢:” + employee[AGE] + ” / “);
document.write(“血液型:” + employee[BLOOD_TYPE] + “\n”);
});
これだけのためにprototype.jsを使うもアレなんで,こちらもご参考に(特に「互換性」のところ).
https://developer.mozilla.org/ja/Core_JavaScript_1.5_Reference/Global_Objects/Array/forEach