【JavaScript】配列をしっかり理解しよう(値の取り出し/書き換え/追加)
おはようございます。タカヒデです。
本日は、「JavaScriptにおける、『配列』について、値の「取り出し/書き換え/追加」方法」を紹介します。
- JavaScriptにおける『配列』が理解できない
- 『値の取り出し/書き換え/追加』の記載方法を知りたい
この記事はプログラミング学習をあらためて再開した際、「配列」を理解し直すために書いたものです。
同じように理解したい方はぜひ本記事を参考にしてください。
配列とは?
配列ってプログラミング学習していると、とてもよく聞きますよね。
何ならもう最初の最初に聞くんじゃないか?くらい。
この配列とは、1つの変数に複数の値(要素)を格納したものです。
英語でいうと「array」です。
これを日本語で読むと「アレイ」です。
私は「アライ」って読んで恥をかいたので注意してください。
この後、記載例を載せているんですが、↓の画像ように複数の要素が格納されているイメージを持ってください。

では、記載方法を見ていきましょう。
//記載方法
変数名 = [値0,値1,値2,値3,・・・]続けて以下が記載例です。
let noodles = ["うどん", "そば", "ラーメン", "そうめん"];
console.log(noodles);
//実行結果:(4) ['うどん', 'そば', 'ラーメン', 'そうめん']今回の記載例では『noodles』という変数に対し、『うどん』『そば』『ラーメン』『そうめん』という4つ値をそれぞれ格納しています。
このインデックス番号は0から始まる点に注意しましょう。
ちなみに私は健康のために平日の昼食はほぼ毎日そばです。
健康になりたい人はぜひ食べてくださいね。
配列の値の取り出し/書き換え/追加
続けて、配列の値(要素)を取り出し/書き換え/追加する方法です。
配列の値の取り出し
まず配列の値を取り出す方法です。
ここでは、0番の要素「うどん」を取り出します。
//記載方法
配列名[取り出す番号]以下が記載例です。
let noodles = ["うどん", "そば", "ラーメン", "そうめん"];
console.log(noodles[0]);
//実行結果:うどん0番の要素、『うどん』を取り出しできています。
とても簡単ですね。
配列の番号を変えればどの要素も取り出すことができます。
配列の値の書き換え
続けて、配列の値を書き換えする方法です。
ここでは、1番の要素を、『そば』から『きし麺』に書き換えします。
//記載方法
配列名[書き換える番号] = 書き換えたい値以下が記載例です。
let noodles = ["うどん", "そば", "ラーメン", "そうめん"];
noodles[1] = "きし麵"
console.log(noodles[1]);
//実行結果:きし麵実際に値を取り出してみると、『そば』から『きし麺』に書き換えできていることが分かります。
配列の値の追加
最期に配列の値を追加する方法です。
ここでは、4番に要素『冷麺』を追加します。
//記載方法
配列名[追加する番号] = 追加したい値以下が記載例です。
let noodles = ["うどん", "そば", "ラーメン", "そうめん"];
noodles[4] = "冷麺"
console.log(noodles);
//実行結果:(5) ['うどん', 'そば', 'ラーメン', 'そうめん', '冷麺']「noodles」の要素が増え、4番に『冷麺』を追加できています。
まとめ
以上が「JavaScriptにおける、『配列』について、値の「取り出し/書き換え/追加」方法」でした。
- 配列とは、1つの変数に複数の値(要素)を格納したもの
- 取り出し:配列名[取り出す番号]
- 書き換え:配列名[書き換える番号] = 書き換えたい値
- 追加:配列名[追加する番号] = 追加したい値
この記事が誰かの参考になれば幸いです。
お疲れさまでした。
