こんにちは、kazuです。
本日は配列は実際にどのように使用されるか?
について記事にしていこうかと思います。
どういうことなのと言われそうなので先に伝えておくと初学者の配列の認識って [] で値を入れるものをとかしか
思っていないのではと考えました。(自分もそうでしたので。。)
それに配列の詰め方は記事として多くありますがこのようなどういう処理ができるかの解説はあまりないように思えたので今回記事にしていこうと思いました。
配列とは
実際に配列とは何かを簡単に言うと要素(データ)をまとめていれるようなイメージです。
実際にどういうことかを配列解説でよくありそうなプログラムで説明します。
var fruitArray = ["りんご", "バナナ", "みかん"];
console.log("フルーツ配列 : "+fruitArray);
// 実行結果
フルーツ配列 : ["りんご", "バナナ", "みかん"]
上記のようにりんごとバナナとみかんを fruitArray という変数1つで複数のデータを詰めることができることができることを配列といいます。
ただここで疑問に思ったことがある方がいるのではないでしょうか?
「??」これができるから何?と
今回は配列でどのような動作を作ることができるのかを今回はいくつか挙げていこうと思います。
できること1
できることの1つ目です。リストの文言をリストの箇所によって呼び出す。
あなたは以下画像のようなリストは見たことがありませんか?

ボタンを押したらリストが追加されるようなものです。
そしてこの文言は配列に入れた文字を出力させることができます。
どういうことか以下コードを見てください。
var user1 = {
arrayNum : "0",
name : "ゆっくり霊夢",
mail : "yukkurireimu@reimu.com",
password : "yukkurireimu"
}
console.log("user1"+JSON.stringify(user1));
var user2 = {
arrayNum : "1",
name : "ゆっくり魔理沙",
mail : "yukkurimarisa@marisa.com",
password : "yukkurimarisa"
}
console.log("user2"+JSON.stringify(user2));
var user3 = {
arrayNum : "2",
name : "ゆっくり妖夢",
mail : "yukkuriyoumu@youmu.com",
password : "yukkuriyoumu"
}
console.log("user2"+JSON.stringify(user3));
var userArray = [user1, user2, user3]
console.log("user2"+JSON.stringify(userArray));
今回は3つのオブジェクトを手書きですが追加しました。
これを最後に配列に入れています。
そして最後にfor文などでループを回してHTMLに表示させるということが可能です。
これが一つ目の使い方です。
できること2
では次に行きましょう!2つ目にできることはreturnを複数返すときです。
大体意味は分かると思いますが、関数を作って複数の値を返したいときに配列を使ったりします。
以下コードを見てください
var testScore = [100, 80, 60, 40, 15];
score();
function scoreJudgment(testScores){
// 最大値を取得
var maxScore = Math.max.apply(null, testScores);
// 最小値を取得
var minScore = Math.min.apply(null, testScores);
// 最大点数と最小点数を配列に入れて返す
return [maxScore, minScore];
}
function score(){
// 最大値と最小値の配列を取得
var score = scoreJudgment(testScore);
console.log("scoreArray"+JSON.stringify(score));
console.log("最高点数"+score[0]);
console.log("最少点数"+score[1]);
}
少し解説をすると、scoreJudgmentにテストの点数を記載したscoreの変数を引数を渡しています。
そのあと最大値と最小値を出してからreturnの配列に最大値と最小値を入れてで返しています。
それをscoreで受け取りconsole.logで出力しているという処理になります。
解説は以上でそのような使い方もできます。
最後に
いかがでしたでしょうか?
初学者には配列って理解しづらいことかと思っています。(私もそうでしたので)
でもこういう使い方もできるんだということを知るだけで理解が速くなるかもしれないので今回記事を書きました。
ただ知っておいてほしいのがもっと今回は1部の使い方であり他にも使い方はいろいろあるということを知っておいてください。
少しでも役に立て嬉しく思います。
最後までご覧いただきありがとうございました。