JavaScript 配列を作成するサンプル |

JavaScriptの配列を作成するサンプルです。

配列
配列リテラルで配列を作成する
Arrayオブジェクトで配列を作成する
入れ子の構造の配列を作成する
連想配列を作成する
Arrayオブジェクト

配列

ひとつの変数に複数の値を設定することができます。
配列のそれぞれの値はインデックス番号でアクセスできます。
インデックス番号は0から始まります。

配列リテラルで配列を作成する

配列リテラルで配列を作成するサンプルです。

3行目は、リテラルで配列を作成しています。リテラルとはコード中に記述された値です。
後述のArrayオブジェクトより、配列リテラルのほうがわかりやすいです。

<script>

var a = ["赤","黄","青"];

document.writeln(a,"<br />"); // 赤,黄,青

document.writeln(a[0],"<br />"); // 赤
document.writeln(a[1],"<br />"); // 黄
document.writeln(a[2],"<br />"); // 青

</script>

Arrayオブジェクトで配列を作成する

Arrayオブジェクトで配列を作成するサンプルです。

3行目は、Arrayオブジェクトのコンストラクタで配列を作成しています。
9行目は、Arrayオブジェクトのコンストラクタで配列の数を定義し、11-13行目で値をセットしています。

<script>

var a = new Array("あ","い","う");

document.writeln(a[0],"<br />"); // あ
document.writeln(a[1],"<br />"); // い
document.writeln(a[2],"<br />"); // う

var b = new Array(3);

b[0] = "A";
b[1] = "B";
b[2] = "C";

document.writeln(b[0],"<br />"); // A
document.writeln(b[1],"<br />"); // B
document.writeln(b[2],"<br />"); // C

</script>

入れ子の構造の配列を作成する

入れ子の構造の配列を作成するサンプルです。

3-7行目は、入れ子の構造の配列を作成しています。
13-15行目は、インデックス番号を2つ使用して配列の値を参照しています。

<script>

var a = [
	"色の種類",
	["赤","黄","青"],
	["緑","白","黒"]
];

document.writeln(a[0],"<br />"); // 色の種類
document.writeln(a[1],"<br />"); // 赤,黄,青
document.writeln(a[2],"<br />"); // 緑,白,黒

document.writeln(a[1][0],"<br />"); // 赤
document.writeln(a[1][1],"<br />"); // 黄
document.writeln(a[1][2],"<br />"); // 青

</script>

連想配列を作成する

連想配列を作成するサンプルです。

3行目は、連想配列を作成しています。
5-7行目は、作成した名前をキーにして値を表示しています。

<script>

var a = {c1:'赤',c2:'黄',c3:'青'};

document.writeln(a["c1"],"<br />"); // 赤
document.writeln(a["c2"],"<br />"); // 黄
document.writeln(a["c3"],"<br />"); // 青

</script>

Arrayオブジェクト

配列のオブジェクトです。
以下はMDNのArrayオブジェクトのリンクです。
https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/Array