Javascriptで配列を扱う

2014/12/23

Javascript

Javascriptで良く使うのでメモ。
Javascriptで配列を扱う場合、通常の配列と連想配列で使用する型が違うので注意が必要です。

1 配列
2 連想配列

配列

通常の配列はArray型として使用します。

配列の生成方法

以下の方法で配列の生成と生成時にデータの投入が行えます。

// 「data」は配列名
// 配列生成
var data = [];

// 配列生成 & データ投入
var data = ['data1','data2','data3'];

配列へのデータ追加

配列へのデータ投入方法。

// 配列名.pushで配列の末尾にデータを追加
data.push('data4');

// 配列名[インデックス]で指定位置に追加
data[3] = 'data4';

配列からデータ取得

配列からのデータを取得する方法。

// 配列からデータを取得する場合はインデックス番号を指定。
// ただし、配列は0から始まるので1番めのデータは0に格納されている。
var index_data = data[0];

// 一括取得
for(var i = 0; data.length; i++){
    var index_data = data[i];
    // 各処理...
}

for文で回して配列に対して一括処理を行えるがこれを行う場合、配列が順次入って居ないといけない。
理由としてはdata.lengthで配列の要素数を取得して順次処理を行っていくため、順次データが入っていないと全データ回すことが出来ないためである。

連想配列

連想配列はオブジェクト型として使用します。

オブジェクトの生成方法

連想配列を使用する場合、オブジェクト型として生成しなければいけません。

// オブジェクトの生成
var array_obj = new Object();

// オブジェクト生成 & データ投入
var array_obj = { key1: 'value1' , key2: 'value2' };

オブジェクトへのデータ追加

通常の配列型と違って常にキーを指定しなければいけません。

// データ追加
// オブジェクト[キー] = データ
array_obj['key3'] = 'value3';

オブジェクトからデータ取得

配列と違ってfor…in文を使用してオブジェクトから一括取得できます。

// キーを指定して取得
var index_data = array_obj['key3'];

// 一括取得
// キー用変数 in 連想配列オブジェクト
for (var key in array_obj) {
    var index_data = array_obj[key];
    // 各処理...
}

順番にデータが入っている場合、順番に意味がある場合は通常のarray型を使用。
キーに意味がある場合は、オブジェクト型の連想配列を使用等、柔軟に使い分けが出来ます。

«前の記事：Gmailで大量のアカウントが必要な場合の対処方法 HTML5 FileAPIでイメージの読み込み：次の記事»

配列