【誰でもわかる!】配列とは

2020年8月27日

皆さんは「配列」という言葉を聞いたことはありますか?

プログラミングを学習していくうえで、たまに使う程度かもしれない配列ですが、配列を使いこなせるようになると、コードの簡略化など様々な部分で活用できます!

なので、この記事を読んで、初めて学ぶ方にはどんなものかをわかっていただき、すでに知っている方には再確認する機会としていただきたいです!

今回は主にJavaScriptの配列の説明をしますが、ほかのプログラミング言語にも共通することだらけなので、ぜひ参考にしてください!


その前に…

今回の配列の説明には、変数の知識がないとわかりません!
なので、変数を知らない方や、よく理解していない方は私の過去の記事をぜひ読んでください!

【誰でもわかる!】変数とは

変数の説明 変数とは、プログラミングにおいて一番大事なものです!だけど変数を知りたくて調べても、「変数は箱である」といった説明がありますが、しっくりこない、なんてことありませんか? ここで私は全く違ったもので例えたいと思 […]


関数とは?

変数の解説の記事を読んでくださった方には説明しましたが、「変数というのは紙である」、と考えると配列も考えやすいです。

おさらいですが、変数というのは、表も裏も何も書いていない紙に、表に名前、裏に数字などの情報を書き込むものでしたね。

プログラムが長くなっていくと、変数をたくさん作ることになり、様々な情報が書き込まれた紙がそこらへんに散らばってきたなくなってしまいますね。

紙がたくさんある時は、クリアファイルに同じような書類をまとめますよね!

このクリアファイルが配列です!

たくさん同じような変数を使うときに、一つの配列にまとめることによって使いやすくなります!

ここで実際にJavaScriptのコードを書いて見ましょう!

let dinner = ["カレー", "ラーメン", "ハンバーグ"];

配列を作る時は、このように変数の時と同じような書き方になります。
違う部分というのは、イコールの右側の部分で、[] で囲まれているのがわかりますね!

今回は、dinnerという名前のクリアファイルを用意して、一枚目に「カレー」、二枚目に「ラーメン」、三枚目に「ハンバーグ」と書いた紙を入れました。

後は使いたいときに、dinnerの何番目を使う、形で取り出すことができるのですが、ここで一つ注意しなければなりません。

それはパソコンが何かを数える時、「0」から数え始めるということです。

人間がものを数える時には、1、2、3、と数えていきますが、パソコンは0、1、2、と数えていきます。

なので先ほどの配列で、例えば「カレー」と書かれた紙を取り出したかったら、「dinnerの0番目を取り出す」といった命令を書かなければいけません。

配列からその中に入っているものを取り出すというコードを少し書いて見ますので、結果がどうなるか考えてみましょう!

let suji = [1, 2, 3, 5, 6];
let a = suji[2];

二行目の、suji[2]というのが、sujiという配列の2番目を取り出すといった意味になります。

上のコードを実行したら、a はどんな値になるでしょうか?

正解は…

3になります!

先ほども言った通り、パソコンは0から数え始めるので、2番目は配列の左から3つ目の値になるので、sujiという配列の左から3番目にある「3」という数字が、a になります!

1 2 3 5 6
0 1 2 3 4

左から、0、1、2と数えていくことが少し紛らわしいですが、そこさえわかればもうあなたも配列はほとんど理解できています!


多次元配列

配列の発展型として、多次元配列というものがあります。

配列をクリアファイルと例えたので、多次元配列は引き出しと考えるとすごく分かりやすいです。

たくさんのデータ作ると、クリアファイルで分けても、クリアファイルをまたまとめるために、引き出しにしまいますよね。
これが多次元配列の考え方です。

実際にコードを見てみましょう!

let meal = [ ["牛乳", "パン", "ヨーグルト"], ["お茶", "ラーメン", "みそ汁"], ["ビール", "餃子", "ごはん"] ];

少し見にくいですが、mealという配列に、[“牛乳", “パン", “ヨーグルト"]と[“お茶", “ラーメン", “みそ汁"]と[“ビール", “餃子", “ごはん"]が入っているという形です。

そしてこの多次元配列から、「みそ汁」を取り出そうとすると下のようになります!

let a = meal[1][2];

「meal」の2番目の配列に入っている3番目を取り出す、といったように少し入り組んで紛らわしいかもしれませんが、このようになります!

これで、a を「みそ汁」にすることができました!

多次元配列というのは、いろいろなデータなどを一つにまとめたものなので、少し難しいかもしれませんが、少しずつ慣れていきましょう!

ではここでまた問題です!

let student = [ ["山田", 19, "男"], ["田中", 18, "男"], ["前田", 20, "女"], ["佐藤", 21, "女"] ];
let a = student[0][2];
let b = student[3][1];

このコードを実行したときに、a と b はどんな値になるでしょう!

答えは…

a は「男」という文字、b は「20」という数字になります!

student[0][2]は、studentの中の0番目の中の、2番目にする、という意味なので、山田さんのデータの2番目の「男」になります!

同様にbも考えると、「20」になります!


これであなたも配列マスター!

今回学んだことで、配列の基礎は完璧です!
多次元配列になってくると、ややこしくなってきますが、ゆっくり考えて少しずつ理解していきましょう!

また、たくさんの変数を作る時には、配列を使うなどして、自分のコードを見やすくする練習もしてみましょう!

配列についてわからないことがあればコメントお待ちしております!
Twitterもやっていますので、こちらにも感想などお願いします!

Twitter開設しました!

ただの大学生のブログが更新されたときや、様々な情報を載せるためのTwitterを開設しました!ブログの裏側を載せたり、読者の方の質問に応えたりします! TwitterのIDはこちらです。@Daigakusei_blog […]