JavaScript

【JavaScript】配列をしっかり理解しよう(値の取り出し/書き換え/追加)

takahide

おはようございます。タカヒデです。

本日は、「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つの変数に複数の値(要素)を格納したもの
  • 取り出し:配列名[取り出す番号]
  • 書き換え:配列名[書き換える番号] = 書き換えたい値
  • 追加:配列名[追加する番号] = 追加したい値

この記事が誰かの参考になれば幸いです。

お疲れさまでした。

ABOUT ME
タカヒデ
タカヒデ
ITを楽しく勉強中
通信会社の企画職で働く30代 非エンジニアでありながら半分趣味でITエンジニアリングやプログラミングを学習中 IT初心者が楽しいと思えるように発信することを目指しています ↓Xもやっているのでフォローしてね
記事URLをコピーしました