こんにちは、フロントエンドエンジニアのまさにょんです。
今回は、JavaScriptで配列の最後の要素(値)を取得する3つの方法について解説します。
目次
配列の最後の要素(値)を取得する3つの方法
配列の最後の要素(値)を取得する3つの方法は、
array.pop() と array[array.length -1]、array.slice(-1)[0] です。
それぞれ解説していきます。
array.pop() で配列の最後の要素(値)を取得する
array.pop() は、配列から最後の要素を取り除き、その要素を返します。
このメソッドは元の配列の長さを変化させる、破壊的メソッドです。
ただメソッドとして、意味が明確かつ、メソッドチェーンで記述することができるので使いやすい方法です。
const RobotamaArray = ['ロボ玉試作1号機', 'ロボ玉試作2号機', 'ロボ玉試作3号機'];
const popRobotama = RobotamaArray.pop();
console.log('pop後のRobotamaArray: ', RobotamaArray);
// [ 実行結果 ]
// pop後のRobotamaArray: (2) ['ロボ玉試作1号機', 'ロボ玉試作2号機']
console.log('popRobotama: ', popRobotama);
// [ 実行結果 ]
// popRobotama: ロボ玉試作3号機array[array.length -1] で配列の最後の要素(値)を取得する
array[array.length - 1] は、indexで最後の要素(値)を指定して取得する方法です。
const RobotamaArray2 = ['ロボ玉試作1号機', 'ロボ玉試作2号機', 'ロボ玉試作3号機'];
const LastRobotama = RobotamaArray2[RobotamaArray2.length - 1];
console.log('LastRobotama: ', LastRobotama);
// [ 実行結果 ]
// LastRobotama: ロボ玉試作3号機array.slice(-1)[0] で配列の最後の要素(値)を取得する
array.slice(-1)[0] は、sliceメソッドで最後の要素(値)を取得して、
その返り値(実行結果)である配列から目的となる最後の要素(値)を取り出す方法です。
const RobotamaArray3 = ['ロボ玉試作1号機', 'ロボ玉試作2号機', 'ロボ玉試作3号機'];
const LastRobotamaSlice = RobotamaArray3.slice(-1)[0];
console.log('LastRobotamaSlice: ', LastRobotamaSlice);
// [ 実行結果 ]
// LastRobotamaSlice: ロボ玉試作3号機SampleCode全文
SampleCodeの全文です。
// 配列の最後の要素を取得する3つの方法
const RobotamaArray = ['ロボ玉試作1号機', 'ロボ玉試作2号機', 'ロボ玉試作3号機'];
const popRobotama = RobotamaArray.pop();
console.log('pop後のRobotamaArray: ', RobotamaArray);
// [ 実行結果 ]
// pop後のRobotamaArray: (2) ['ロボ玉試作1号機', 'ロボ玉試作2号機']
console.log('popRobotama: ', popRobotama);
// [ 実行結果 ]
// popRobotama: ロボ玉試作3号機
const RobotamaArray2 = ['ロボ玉試作1号機', 'ロボ玉試作2号機', 'ロボ玉試作3号機'];
const LastRobotama = RobotamaArray2[RobotamaArray2.length - 1];
console.log('LastRobotama: ', LastRobotama);
// [ 実行結果 ]
// LastRobotama: ロボ玉試作3号機
const RobotamaArray3 = ['ロボ玉試作1号機', 'ロボ玉試作2号機', 'ロボ玉試作3号機'];
const LastRobotamaSlice = RobotamaArray3.slice(-1)[0];
console.log('LastRobotamaSlice: ', LastRobotamaSlice);
// [ 実行結果 ]
// LastRobotamaSlice: ロボ玉試作3号機
JavaScript書籍 Ver. 中級-上級者向け
JavaScript書籍 Ver. 初級者向け
Twitterやってます！Follow Me！
神聖グンマー帝国の逆襲🔥
神聖グンマー帝国の科学は、世界一ぃぃぃぃぃぃ！！！！！
参考・引用
最近の投稿
【SQL】1回のINSERTで、複数行のレコードを一括挿入・一括追加する方法
JavaScriptでランダムなuuidを作成する方法(randomUUIDの使い方)
PythonでCSVをJSONに変換する方法
PythonでCSV・Dataframeを指定の行数まで切り取る方法
JavaScript(TypeScirpt)のfor-of文でindexの値も取得する方法と、Type IterableIteratorエラーの解決方法
VSCode上のPython import文の「インポート “XXXXX” をソースから解決できませんでした」エラーの解決方法
