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

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

目次

配列

  • ひとつの変数に複数の値を設定することができます。
  • 配列のそれぞれの値はインデックス番号でアクセスできます。
  • インデックス番号は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オブジェクト

関連の記事

JavaScript if文で配列を比較するサンプル
JavaScript 配列の値をループで取得するサンプル(for…in文)
JavaScript 配列を操作するサンプル(Arrayオブジェクト)

 はまったらエンジニア特化型Q&Aサイト
【teratail(テラテイル)】で質問しましょう!


△上に戻る