Array.prototype.at()

index

返される配列要素のゼロ基点の添字（位置）で、整数に変換されます。負の添字を使用した場合は、配列の末尾から逆に数えた位置です。index < 0 であれば、 index + array.length がアクセスされます。

配列の中で指定された位置に一致する要素です。index < -array.length または index >= array.length の場合は、対応するプロパティにアクセスしようとせず、常に undefined を返します。

at() メソッドは、index が負でない場合、ブラケット記法と等価です。例えば、array[0] と array.at(0) は、どちらも最初の項目を返します。しかし、配列の末尾から要素を数える場合、PythonやRのように array[-1] を使用することはできません。角括弧内の値はすべて文字列プロパティとしてリテラルに扱われるため、結局、配列のインデックスではなく通常の文字列プロパティである array["-1"] を読むことになります。

通常、length にアクセスし、そこからインデックスを計算します。例えば、 array[array.length - 1] のようになります。 at() メソッドでは相対インデックスが可能なので、これを短縮して array.at(-1) とすることができます。

at() と with() を組み合わせることで、負のインデックスを用いた配列の読み取りと書き込みが（それぞれ）できます。

at() メソッドは汎用的です。this 値に length プロパティと整数キーのプロパティがあることだけを期待します。

以下の例は、指定された配列の中で最後に見つかった要素を返す関数を提供します。

// 項目付きの配列
const cart = ["りんご", "バナナ", "なし"];

// 指定された配列の最後の項目を返す関数
function returnLast(arr) {
  return arr.at(-1);
}

// 配列 'cart' の最後の項⽬を取得する
const item1 = returnLast(cart);
console.log(item1); // 'なし'

// 配列 'cart' に商品を追加
cart.push("みかん");
const item2 = returnLast(cart);
console.log(item2); // 'みかん'

この例では、 Array の最後から 1 つ目の項目を選択するさまざまな方法を比較しています。以下に示すどの方法も有効ですが、at() メソッドの簡潔さと読みやすさが際立っています。

// 項目付きの配列
const colors = ["red", "green", "blue"];

// length プロパティの使用
const lengthWay = colors[colors.length - 2];
console.log(lengthWay); // 'green'

// slice() メソッドを使用。配列を返すことに注意。
const sliceWay = colors.slice(-2, -1);
console.log(sliceWay[0]); // 'green'

// at() メソッドを使用
const atWay = colors.at(-2);
console.log(atWay); // 'green'

at() メソッドは、this の length プロパティを読み込んで、アクセスする添字を計算します。

const arrayLike = {
  length: 2,
  0: "a",
  1: "b",
  2: "c", // length が 2 なので at() からは無視される
};
console.log(Array.prototype.at.call(arrayLike, 0)); // "a"
console.log(Array.prototype.at.call(arrayLike, 2)); // undefined

• Array.prototype.at のポリフィル (core-js)
• インデックス付きコレクションガイド
• Array
• Array.prototype.findIndex()
• Array.prototype.indexOf()
• Array.prototype.with()
• TypedArray.prototype.at()
• String.prototype.at()