Javascript/Javascriptの基本

Javascriptの「配列」とは

JavaScriptを書くときに知っておくべき基礎用語を解説します。今回は「配列」です。

高橋 登史朗

執筆者:高橋 登史朗

Javascriptガイド

配列とは

変数」は、値を入れる入れ物のようなものでしたが、「配列」は、複数の値に同じ名前をつけた箱を用意して、その箱に連番をつけたようなものです。見た方が早いですね。こうです。
var a = [];

    a[0] = "おはよう";
    a[1] = "こんにちは";
    a[2] = "こんばんは";

変数の宣言と同様に、「var a = []」で配列「a」が用意されます。この配列「a」は、次のようにアクセスすることができます。
alert(a[0]);
これで「おはよう」と表示されます。

alert(a[1]);
これは「こんにちは」です。

alert(a[2]);
もうわかりますね。「こんばんは」です。

この最初の配列を宣言している場所「var a = [ ]」をみてください。これは、次のように書くこともできます。
var a = new Array();

これは、「new」演算子というキーワードを使って配列オブジェクトを作っているのですが、このnewされる 関数 Array()を「コンストラクタ」と呼びます。

前者の角括弧「[ ]」の方は、「配列リテラル」あるいは「配列イニシャライザ」と呼ばれることもあります。

まあ、呼び名はおいおい覚えていくとして、この二つの書き方それぞれで、宣言と同時に一度に配列の中身まで格納してしまう方法を見ておきます。
var a = [123,456,789];
var a = new Array(123,456,789);

それぞれ、これだけで、一気に宣言と代入が終わってしまいます。

ちなみに、変数の時と同様、JavaScriptでは配列もまた、格納する値の型は「文字列」でも「数値」でもかまいません。「変数」や「関数」、あるいはさらに「配列」さえも入れる事ができます。

さて、この2種類の配列宣言はそれぞれ同じ3つの値を持った配列を作ります。どちらも次のようになります。
alert(a[0]);
これで「123」と表示されます。

alert(a[1]);
これは「456」です。

そして、これは、
alert(a[2]);
そうです。「789」です。

このように、配列のメリットは、ひとつの名前(ここでは「a」)に番号をつけてアクセスできることです。

たとえば、プログラムには「for文」という熟語のようなものがあります。JavaScriptでは、たとえば、次のように書きますが、これを使うと、配列をうまく操作できます。
var a = [123,456,789],
    aLen = a.length;

for (var i=0 ; i < aLen ; i++){
  alert(a[i]);
}

「for文」とは、指定した条件が当てはまる間、処理を繰り返すという構文です。 この例では、「123」「456」「789」というダイアログが順番に表示されます。

まず、「a.length」ですが、配列aのデータ個数、つまりここでは3という意味になります。その3を変数aLen へ代入しましたので、このあと、aLen は3を表します。

次に「for」のうしろの「(var i=0 ; i < aLen ; i++)」に注目してください。
var i = 0 ;
は、変数「i」に0を代入しています。次の
 i < aLen ;
の「<」は、数学の「小なり」と同じで、i が aLan より小さいという意味です。

for文の中では、この条件が成立している間(つまりここではiが3より小さい間)、この括弧の後ろのブロック(「{}」で囲まれた範囲です)が実行されます。 そして、
 i ++ ;
は「インクリメント」と呼び、iに1を足します。 それまで、i が 0 であったとしたら、i++のあとは 1 になり、1 だったら 2 になるという具合です。

このあと次のブロックが実行されますが、それが終わると、また条件式へ戻り、iの値を確かめて、条件を満たせばまたi++し、ブロックの実行を繰り返します。

これを続けていうと次のようになります。
 ( iを0にセット ; i がaLen(つまり3)より小さければ実行 ; iに1を足します )

そして、この実行されるブロックとは、{alert(a[i]);}の部分です。 まず、最初は、iは0にセットされているので、次のコードが実行されるわけです。
alert(a[0]);

配列「a」の中身は、「var a = [123,456,789];」こうでしたので、このダイアログはa[0]の値である「123」が表示されます。

その後、for文は、iの値を増やしながら、iが3を超えるまでアラートを実行しますので。「456」「789」が次々と表示されるというわけです。

この時、配列の名前「a」さえわかっていれば、中身は番号を使って自動的にアクセスできるというのが配列の便利なところです。

【編集部おすすめの購入サイト】
楽天市場で Javascript 関連の書籍を見るAmazon で Javascript 関連の書籍を見る
※記事内容は執筆時点のものです。最新の内容をご確認ください。
※OSやアプリ、ソフトのバージョンによっては画面表示、操作方法が異なる可能性があります。

あわせて読みたい

あなたにオススメ

    表示について

    カテゴリー一覧

    All Aboutサービス・メディア

    All About公式SNS
    日々の生活や仕事を楽しむための情報を毎日お届けします。
    公式SNS一覧
    © All About, Inc. All rights reserved. 掲載の記事・写真・イラストなど、すべてのコンテンツの無断複写・転載・公衆送信等を禁じます