JavaScriptのarray.entries()メソッドとは？使い方をサンプルコードで解説
array.entries()メソッドの概要
JavaScriptのarray.entries()メソッドは、配列のインデックス（キー）と要素（値）のペアを格納した「Array Iteratorオブジェクト」を返すメソッドです。戻り値であるイテレータはfor...ofループなどで展開でき、配列の各要素とその位置を同時に取得したい場合に便利です。
構文
array.entries()
引数は不要です。呼び出し元の配列に対するイテレータオブジェクトが返されます。
サンプルコード1：数値配列での使用例
以下の例では、ランキングポイントの配列に対してentries()メソッドを実行し、キーと値のペアを順番に表示しています。さらに、「Result」ボタンをクリックすると、some()メソッドによって550に等しい値が配列内に存在するかどうかを判定します。
<!DOCTYPE html>
<html>
<body>
<h2>Ranking Points</h2>
<p>Is any point equal to 550 from the key-value pairs...</p>
<button onclick="display()">Result</button>
<p id="test"></p>
<script>
var pointsArr = [10, 20, 30, 40, 50, 60, 70, 80, 90, 1000];
var res = pointsArr.entries();
for (val of res) {
document.getElementById("test").innerHTML += val + "<br>";
}
function pointsFunc(points) {
return points == 550;
}
function display() {
document.getElementById("test").innerHTML = pointsArr.some(pointsFunc);
}
</script>
</body></html>実行結果
ページを読み込むと、インデックスと値のペアが次のように表示されます。
続いて「Result」ボタンをクリックすると、550に一致する値が存在しないため「false」が表示されます。
サンプルコード2：文字列配列での使用例
次の例では、車種名を格納した文字列配列にentries()メソッドを適用しています。ボタンをクリックすると、slice()メソッドで一部の要素を切り出した結果も合わせて表示されます。
<!DOCTYPE html>
<html>
<body>
<h2>Car Variant</h2>
<button onclick="display()">Result</button>
<p id="test"></p>
<script>
var car = ["Hatchback", "Convertible", "SUV", "AUV", "MUV"];
var res = car.entries();
for (val of res) {
document.getElementById("test").innerHTML += val + "<br>";
}
function display() {
document.getElementById("test").innerHTML = "Array after slicing some elements = "+car.slice(1,4);
}
</script>
</body>
</html>実行結果
ページを開くと、各車種名とそのインデックスのペアが表示されます。
「Result」ボタンをクリックすると、slice(1,4)によって抽出された要素（Convertible、SUV、AUV）が表示されます。
まとめ
array.entries()メソッドを使えば、配列のインデックスと値をセットで扱えるため、ループ処理の中で要素の位置情報が必要なケースで活躍します。for...ofループとの組み合わせが基本の使い方となるので、ぜひ実際のコードで試してみてください。
-
JavaScriptのArray.flat()メソッドとは？使い方をわかりやすく解説
Array.flat()メソッドの基本JavaScriptのArray.flat()メソッドは、ネストされた（入れ子になった）配列を、指定した深さまで再帰的に平坦化（フラット化）するためのメソッドです。元の配列は変更されず、新しい平坦化された配列が生成される点が特徴です。引数には平坦化の深さ（depth）を数値で指定します。深さを指定しない場合のデフォルト値は「1」です。また、「Infinity」を指定すると、どれほど深くネストされた配列でも完全に平坦化できます。構文arr.flat(depth)depth（省略可能）：ネストされた配列を展開する深さ。デフォルトは1。サンプルコード以下は、Ar
-
JavaScriptのArray.prototype.includes()メソッドとは？配列内に特定の要素が含まれるか判定する方法
Array.prototype.includes()メソッドとは JavaScriptのArray.prototype.includes()メソッドは、配列の中に特定の要素が含まれているかどうかを判定するためのメソッドです。要素が見つかった場合はtrue、見つからなかった場合はfalseを返します。 基本構文 arr.includes(searchElement[, fromIndex]) searchElement：検索対象となる要素を指定します。 fromIndex（省略可能）：検索を開始するインデックス位置です。省略した場合は先頭（0）から検索されます。 サンプルコード 以下は、in