配列とは

配列とは、複数の変数を1つにまとめたものです。

例えば、ある値を保持する変数を複数用意することを考えましょう。
（変数について詳しく知りたい方は、 変数とは - 入門コース をご覧ください）

変数が3個であれば、次のようなコードでいいかも知れません。

let value1 = 100;
let value2 = 200;
let value3 = 300;

ですが、変数を100個用意しなければならないとしたらどうでしょうか？

let value1 = 100;
let value2 = 200;
let value3 = 300;
・・・（中略）・・・
let value99 = 9900;
let value100 = 10000;

と変数を100回宣言するのはあまりにも大変です。

このような場合、配列を使うと便利です。

配列は以下のように宣言します。

let values = [];

と宣言するだけで、この配列 values の中に100個でも、1000個でも値を入れることができるようになります。

例えば以下のようにします。

let values = [];
for(let i = 0; i < 100; i++) {
  values.push(100 * i);
}

配列に値を追加するには push というコードを利用します。
このようにすることで、配列 values に100個の値を入れることができます。
試しに実行してみましょう。

オンラインエディタ を開き、次のコードを記述してください。

function setup() {
  createCanvas(400, 400);
  let values = [];
  for (let i = 0; i < 100; i++) {
    values.push(100 * i);
  }
  console.log(values);
}

function draw() {
  background(220);
}

実行すると、コンソールに配列の中身が表示されるので、確認してみてください。

コンソール

配列の宣言方法その1

配列の宣言方法について解説します。
まずは先ほどの説明と同じ方法になります。

以下のように配列を宣言し、値を入れることができます。
この方法は、配列の要素の数や値が予め決まっていない場合に便利です。

let values = [];
values.push(100);
values.push(200);
values.push(300);

上記コードで、配列 values に 100, 200, 300 と3つの値が入ります。

配列の宣言方法その2

以下のように配列を宣言し、値を入れることもできます。
この方法は、配列の要素の数や値が予め決まっている場合に便利です。

let values = [100, 200, 300];

上記コードで、配列 values に 100, 200, 300 と3つの値が入ります。

配列の要素の取得方法

配列の各要素の値をコード中で使いたい場合は、以下のように書きます。

values[要素番号]

values という文字は宣言した配列の名前に置き換えてください。

例をあげます。

let values = [100, 200, 300];
console.log(values[0]); //100がログ出力される
console.log(values[1]); //200がログ出力される
console.log(values[2]); //300がログ出力される

上記のようにすることで、配列 values に入っている各要素の値 100, 200, 300 がそれぞれ取得できます。
注意しなければいけないのは、要素番号は0からはじまるという点です。
配列に入っている1つ目の値を取得したいときは、要素番号として 0 を指定します。

配列と繰り返し処理を組み合わせて使う

配列と繰り返し処理は組み合わせて使われることが多いです。
（繰り返し処理について詳しく知りたい方は、 繰り返し処理とは - 入門コース をご覧ください）

例えば次のように書くことができます。

let values = [100, 200, 300];
for(let i = 0; i < values.length; i++) {
  console.log(values[i]);
}

これで、配列 values に入っている各要素の値 100, 200, 300 をそれぞれログ出力できます。
values.length と書くと、配列 values の要素数を取得することができます。
上記コードの例でいうと、 values.length は 3 になります。