【JavaScript基礎】配列（Array）

JavaScript

前回、JavaScriptの変数の宣言とvar、let、constを勉強してみました。

あわせて読みたい

【JavaScript基礎】変数の宣言とvar、let、const JavaScript 前回、JavaScriptのログの出力（console.log）とコメントアウトを勉強してみました。 今回はJavaScriptの変数に関して勉強していきます。 Pythonの場合、変…

今回はJavaScriptの配列（Array）をちょっといじくってみます。

それでは始めていきましょう。

配列の作成

JavaScriptの配列の作成方法は2つあるようです。

一つはPythonと同じように「宣言 配列名 = [要素1, 要素2, 要素3…]」という作成方法で、もう一つが「宣言 配列名 = Array(要素1, 要素2, 要素3…)」という作成方法です。

var num_array1 = [1, 2, 3, 4, 5];
var num_array2 = Array(6, 7, 8, 9, 10);

console.log(num_array1);
console.log(num_array2);

実行結果
[ 1, 2, 3, 4, 5 ]
[ 6, 7, 8, 9, 10 ]

現状でどう違うのかよく分からないのですが、とりあえず作成結果は同じなので、私はPythonで慣れ親しんだ作成法と近い前者の作成法を用いることにします。

要素の取り出し

要素の取り出しとしては、「配列名[インデックス]」で取り出すことができます。

var num_array1 = [1, 2, 3, 4, 5];

console.log(num_array1[1]);

実行結果
2

特定の要素のインデックスを取得：indexOf

次は特定の要素のインデックスを取得する方法です。

例えば先ほどの「num_array1 = [1, 2, 3, 4, 5]」の「3」のインデックスを取得したいときに使います。

このような場合には「配列名.indexOf(要素)」を用います。

var num_array1 = [1, 2, 3, 4, 5];

console.log(num_array1.indexOf(3));

実行結果
2

要素の追加：push

要素を追加するには「配列名.push(追加する要素)」を使います。

var num_array1 = [1, 2, 3, 4, 5];

num_array1.push(6)

console.log(num_array1);

実行結果
[ 1, 2, 3, 4, 5, 6 ]

要素の削除・置換：splice

要素の削除と置換は「配列名.splice()」を用いますが、その指定の方法が異なります。

まず要素を一つだけ削除する際は「配列名.splice(削除する要素のインデックス, 削除する要素のインデックス)」です。

var num_array1 = [1, 2, 3, 4, 5];

num_array1.splice(1, 1);

console.log(num_array1);

実行結果
[ 1, 3, 4, 5 ]

複数の連続した要素を削除する際は「配列名.splice(削除する範囲の開始のインデックス, 削除する範囲の終わりのインデックス)」です。

var num_array1 = [1, 2, 3, 4, 5];

num_array1.splice(1, 3);

console.log(num_array1);

実行結果
[ 1, 5 ]

これが少し注意ですが「配列名.splice(インデックス)」とすると、指定したインデックス以降の要素が削除されます。

var num_array1 = [1, 2, 3, 4, 5];

num_array1.splice(1);

console.log(num_array1);

実行結果
[ 1 ]

最後に置換ですが、「配列名.splice(置換開始インデックス, 置換終了インデックス, 挿入する要素1, 挿入する要素2, 挿入する要素3…)」とします。

var num_array1 = [1, 2, 3, 4, 5];

num_array1.splice(1, 3, 6, 7, 8);

console.log(num_array1);

実行結果
[ 1, 6, 7, 8, 5 ]

特定の範囲の要素を取得：slice

特定の範囲の要素を取得するには「配列名.slice(開始インデックス, 終了インデックス)」とします。

ただし終了のインデックスの要素は取得される要素に含まれません。

var num_array1 = [1, 2, 3, 4, 5];

console.log(num_array1.slice(1,3))

実行結果
[ 2, 3 ]

ちなみにPythonでは「配列名[開始インデックス:終了インデックス]」で特定の範囲の要素を取得できますが、JavaScriptではできないようです。

配列の要素数を取得：length

配列の要素数を取得するのは「配列名.length」です。

var num_array1 = [1, 2, 3, 4, 5];

console.log(num_array1.length)

実行結果
5

配列中に特定の要素が含まれるか確認：in

配列中に特定の要素が含まれるか確認するには「確認したい要素 in 配列名」です。

var num_array1 = [1, 2, 3, 4, 5];

console.log(3 in num_array1)

実行結果
true

まだ色々とあるようですが、とりあえずこれくらいを覚えておけばJavaScriptの配列は使えるかなと思います。

次回はfor文の使い方を勉強してみます。

あわせて読みたい

【JavaScript基礎】繰り返し処理for文の使い方 JavaScript 前回、JavaScriptの配列（Array)を勉強しました。 今回は繰り返し処理で使用するfor文を勉強していきます。 それでは始めていきましょう。 for文の基礎 Java…

ではでは今回はこんな感じで。