【JavaScript】配列の基本と使い方まとめ(作成・操作・ループ処理など)

JavaScript

はじめに

JavaScriptの配列は、複数のデータをまとめて管理するために使用します。今回は、配列の作成方法から、要素の操作・検索・ループ処理まで例を含めて記載していきます。

 

配列の作成

配列は [](角括弧)で囲むことで作成します。中にはカンマで区切った複数の値を入れることで作成することができます。

 

宣言方法

型 変数名 = [配列]

 

let numbers = [1, 2, 3, 4]; 
const months = ["1月", "2月", "3月", "4月", "5月", "6月", "7月", "8月", "9月", "10月", "11月", "12月"]  // const でも配列は宣言できる(再代入不可)

 

配列の要素への参照

インデックス番号(0から始まる)を使って、配列の各要素にアクセスします。

 

console.log(numbers[2]); // 3

 

配列の要素数を取得

「.length」を使用することで、配列の要素数を取得します。

 

console.log(numbers.length); // 4

 

要素の追加

配列は以下のメソッドで要素の追加をすることができます。
・push:末尾に追加
・unshift:先頭に追加

 

numbers.push(5);    // 末尾に追加
numbers.unshift(0);    // 先頭に追加

 

要素の削除

配列は以下のメソッドで要素の削除をすることができます。
・pop:末尾の要素を削除
・shift:先頭の要素を削除

 

fruits.pop();    // 末尾の要素を削除
fruits.shift();  // 先頭の要素を削除

 

配列のループ処理

配列の全要素に処理を行うには以下の方法があります。

for文

for (let i = 0; i < numbers.length; i++) {
    console.log(numbers[i]);
  }

 

for...of文

for (let number of numbers) {
    console.log(number);
  }

 

forEach文

numbers.forEach(function(number) {
    console.log(number);
  });

 

配列内の検索

位置検索

console.log(months.indexOf("3月"));  // 2

 

含まれるか確認

console.log(months.includes("3月")); // true

 

配列の並び替え

配列の順序を変更するためのメソッドです。
・昇順:sort
・降順:reverse

 

numbers.sort();
numbers.reverse();

 

配列の結合

複数の配列をつなげたり、文字列に変換できます。
・concat:配列の結合
・join:配列を文字列に変換する

 

let merged = numbers.concat(months);     // 1, 2, 3, 4, '1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月'
console.log(months.join("・"));         // 1月・2月・3月・4月・5月・6月・7月・8月・9月・10月・11月・12月

 

最後に

JavaScriptの環境構築は、この記事を参照してみてください。
【JavaScript】VSCodeでJavaScriptを使用するための環境構築を実施する – SEもりのLog JavaScript

以上、ログになります。
これからも継続していきましょう!!

JavaScriptフロントサイド関連
おすすめIT本
良いコード/悪いコードで学ぶ設計入門

「ITエンジニア本大賞2023」技術書部門で大賞を受賞した本です。
・コードの可読性
・普段意識したほうが良いこと
・リファクタリング考え方
等、普段のコードを設計する際に意識することが書かれています。
コードのあるべき姿に迷ったら一度読んでみると良い本です。

仕組みと使い方がわかる Docker&Kubernetesのきほんのきほん

Dockerって何?となったときに私が最初に読んだ本です。
Dockerがどんな仕組みで動いているのか、コマンドでは何を命令しているのかを理解できるように、イラストを多用して説明しています。

1冊ですべて身につくJavaScript入門講座

「ITエンジニア本大賞2024」技術書部門で大賞を受賞した本です。
私が次に読もうと思っている本なのでおすすめとして挙げておきたいと思います。

コメント

タイトルとURLをコピーしました