【JavaScript基礎02】配列


はじめに

前回同様、基礎のプログラムについてPCの中のプログラムを整理がてら紹介します。てか、紹介でもない...。
今回は配列について。

配列

配列とは、複数の箱を持った変数で、配列を利用することで複数のデータとそのデータの順番を格納でき、順番を番号(インデックス)で表し、0から始まり、配列名[0]、配列名[1]、配列名[2]、...で示す。

1.配列の宣言

配列の宣言->変数を作ること。

var 変数名 = new Array(x);

*xは配列の大きさ。つまり用意する箱の数。

例01)

var hoge = new Array(9);

これでhogeという配列ができ、その中に10個の値を格納(値を入れる)ことができる。

配列へのデータの代入

配列に値を代入するには、変数と同様に代入演算子 (Assignment operator) を使って配列名の後ろでインデックスを指定する。

配列名[i] = ;

*文字も格納可能。
*代入演算子とは、「=」のこと。

例02)

hoge = [0,2,10,30,40,28,9,10,30,2];
var _hoge = hoge[2];

これは_hogeという変数に配列であるhogeの2番目に格納されている値を_hogeに代入している。今回はその値は10である。また、配列する準備ができたら上記の例のようにhoge = [0,2,10,30,40,28,9,10,30,2];という風にカンマで一区切りとされ、10個の値を前から順に格納できる。ただし、hogeに格納されている値は0番目からということを忘れずに。

配列のデータの参照

配列に代入した値を参照するには、インデックスを指定して参照する。

例03)

var _hoge2 = _hoge + 1;
var _hoge3 = hoge[3] + hoge[0];
var _hoge4 = hoge[5] + 1;

_hoge2には、例02で_hogeにhoge[2]を代入したので、_hogeは10である。よって、_hoge2は10+1の計算となるので11。
_hoge3は、hoge[3]とhoge[0]の足し算で、配列hogeに格納した3番目の数と0番目の数の足し算となるので、_hoge3は30+0を計算した結果30という値になる。
同様にして、_hoge4はhoge[5]に格納されている28+1なので29という値となる。

グローバル変数とローカル変数

グローバル変数とは

プログラムの全体で使える変数のこと。グローバルコード(HTMLのタグ外であり、関数の外にあるコード)で宣言するとグローバル変数となる。

ローカル変数とは

関数内など限られた範囲でのみ有効な変数のこと。HTMLのタグ内、または関数内で宣言するとローカル変数となる。

例04)

上記のグローバル変数とローカル変数は次の例で確認してほしい。

hoge.html

<html>
    <head>
        <title>hoge</title>
        <script>
        /*--numberArrayとmax_numberがグローバル変数--*/
        var numberArray = new Array(10);    
        var max_number = 100;

        function testMethod(){
            /*--iとjがローカル変数--*/
            var i,j;
            for(i=0;i<10;i++){
                numberArray[i] = Math.random()%3;
                document.write((numberArray[i]+max_number)+"<br>");
            }
        }
        </script>
    </head>

    <body>
        <script>
            testMethod();    //関数の呼び出し
        </script>    
    </body>
</html>

この表示結果は

100.37061285902746
100.86192406388
100.2949768404942
100.13671321840957
100.30868708342314
100.09659432037733
100.48186643468216
100.15702182915993
100.29797119670548
100.85369600891136

となる。グローバル変数とローカル変数についてはもっと詳しく書かれた記事があったのでそちらの方でご確認ください。

参考記事:スコープと命名規則について(グローバル変数とローカル変数)