概要:このチュートリアルでは、JavaScript 配列の at() メソッドを使用して、インデックスで要素を返す方法を学びます。
JavaScript 配列 at() メソッドの概要
JavaScript では、角括弧 [] を使用して、配列の要素にアクセスできます。たとえば、arr[0] は配列 arr の最初の要素を返し、arr[1] は 2 番目の要素を返す、という具合です。
配列の最後の要素を取得するには、次のように length プロパティを使用します。
arr[length-1]Code language: CSS (css)JavaScript では、Python などの他の言語のように、負のインデックスを使用して最後の要素にアクセスすることはできません。たとえば、以下は undefined を返します。
arr[-1]Code language: CSS (css)理由は、JavaScript が角括弧 [] を オブジェクトのプロパティにアクセスするためにも使用しているからです。
たとえば、obj[1] は、キーが "1" のオブジェクト obj のプロパティを返します。したがって、obj[-1] は、キーが "-1" のオブジェクトのプロパティを返します。
上記の例では、arr[-1] は、キーが "-1" の arr オブジェクトのプロパティを返します。配列の型は object であることに注意してください。 "-1" プロパティは arr オブジェクトに存在しないため、undefined を返します。
このため、ES2022 では、Array、String、および TypeArray の prototype に新しいメソッド at() が導入されました。このチュートリアルでは、Array.prototype の at() メソッドに焦点を当てています。
at() メソッドはインデックスを受け取り、そのインデックスにある要素を返します。以下は at() メソッドの構文です。
arr.at(index)Code language: CSS (css)この構文では、index は返す配列要素を指定します。ゼロ、正、または負の数を指定できます。
インデックスがゼロまたは正の場合、at() メソッドは [] のように動作します。
ただし、負のインデックスを使用すると、メソッドは配列の末尾から要素を返します。たとえば、arr.at(-1) は最後の要素を返し、arr.at(-2) は最後から 2 番目の要素を返す、という具合です。
JavaScript 配列 at() メソッドの例
次の例は、at() メソッドを使用して配列要素を返す方法を示しています。
const scores = [5, 6, 7];
console.log(scores.at(1)); // same as scores[1]
// get the last element
console.log(scores.at(-1)); // 7
console.log(scores.at(-1) === scores[scores.length - 1]); // trueCode language: JavaScript (javascript)出力
6
7
trueCode language: JavaScript (javascript)まとめ
at()メソッドを使用して、インデックスで配列の要素を返します。- 負のインデックスを持つ
at()メソッドは、配列の末尾から要素を返します。