JavaScript 中獲取數(shù)組最后一個元素方法匯總
當需要從 JavaScript 中的數(shù)組中獲取最后一個元素時，有多種選擇，本文將提供 3 種可用方法。
1. 數(shù)組 length 屬性
??length?? 屬性返回數(shù)組中元素的數(shù)量。從數(shù)組的長度中減去 ??1?? 得到數(shù)組最后一個元素的索引，使用它可以訪問最后一個元素。從長度中減去 ??1?? 的原因是，在 JavaScript 中，數(shù)組索引編號從 ??0?? 開始。即第一個元素的索引將為 ??0??。因此，最后一個元素的索引將為數(shù)組的 ??length-1??。
const arrayTest = ["第一個元素", "第二個元素", "最后一個元素"]; const length = arrayTest.length; const lastValue = arrayTest[length - 1]; console.log(lastValue); // 最后一個元素
2. 數(shù)組 slice 方法
??slice()?? 方法從一個數(shù)組中返回特定的元素，作為一個新的數(shù)組對象。此方法選擇從給定開始索引開始到給定結束索引結束的元素，不包括結束索引處的元素。??slice()?? 方法不會修改現(xiàn)有數(shù)組，提供一個索引值返回該位置的元素，負索引值從數(shù)組末尾計算索引。數(shù)組匹配的解構賦值用于從 ??slice()?? 方法返回的數(shù)組中獲取元素。
const arrayTest = ["第一個元素", "第二個元素", "最后一個元素"]; const length = arrayTest.length; const [lastValue] = arrayTest.slice(-1); console.log(lastValue); // 最后一個元素
3. 數(shù)組 pop 方法
??pop()?? 方法從數(shù)組中刪除最后一個元素并將其返回，此方法會修改原來的數(shù)組。如果數(shù)組為空，則返回 ??undefined?? 并且不修改數(shù)組。
const arrayTest = ["第一個元素", "第二個元素", "最后一個元素"]; const length = arrayTest.length; const lastValue = arrayTest.pop(); console.log(lastValue); // 最后一個元素 console.log(arrayTest); // [ '第一個元素', '第二個元素' ]
性能比較
讓按性能比較這 3 種方法。
const arrayTest = ["第一個元素", "第二個元素", "最后一個元素"];
console.time("==> length");
const length = arrayTest.length;
let lastValue = arrayTest[length - 1];
console.log(lastValue);
console.timeEnd("==> length");
console.time("====> slice");
let [lastValue1] = arrayTest.slice(-1);
console.log(lastValue1);
console.timeEnd("====> slice");
console.time("======> pop");
let lastValue2 = arrayTest.pop();
console.log(lastValue2);
console.timeEnd("======> pop");輸出的結果如下：
最后一個元素 ==> length: 6.38ms 最后一個元素 ====> slice: 0.038ms 最后一個元素 ======> pop: 0.033ms
總結
??pop()?? 方法是最快的，如果可以修改數(shù)組，則可以使用它。如果你不想改變數(shù)組，可以使用 ??slice()?? 方法。利用數(shù)組 length 屬性的方法是最慢的，屬于是獲取數(shù)組最后一個元素的最常用方法。
到此這篇關于JavaScript 中獲取數(shù)組最后一個元素方法匯總的文章就介紹到這了,更多相關JavaScript獲取數(shù)組最后一個元素內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關文章希望大家以后多多支持腳本之家！
相關文章
javascript ES6中箭頭函數(shù)注意細節(jié)小結
這篇文章主要給大家總結了關于javascript ES6中箭頭函數(shù)注意細節(jié)的相關資料，文中介紹的比較詳細，需要的朋友可以參考借鑒，下面來一起看看吧。2017-02-02
微信小程序開發(fā)之選項卡(窗口底部TabBar)頁面切換
本文主要介紹了微信小程序開發(fā)之選項卡(窗口底部TabBar)頁面切換的相關知識。具有很好的參考價值。下面跟著小編一起來看下吧2017-04-04
拖拉縮放效果，實現(xiàn)通過鼠標拖動來調(diào)整層的面積（寬高）大小。例如選框效果。2008-12-12
這篇文章主要介紹了如何基于js判斷瀏覽器版本,文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值,需要的朋友可以參考下2020-02-02
這篇文章主要介紹了js實現(xiàn)防止被iframe的方法,實例分析了兩種比較常用的javascript防止頁面被iframe的技巧,非常簡單實用,需要的朋友可以參考下2015-07-07
這篇文章主要介紹了推薦4個原生javascript常用的函數(shù),需要的朋友可以參考下2015-01-01
前端本地存儲和緩存的處理是一種重要的技術,它可以幫助改善應用程序的性能和用戶體驗,下面是小編整理的一些處理前端本地存儲和緩存的常用方法,希望對大家有所幫助2023-11-11
這篇文章主要給大家介紹了關于如何通過一分鐘學會JavaScript中try-catch的相關資料，文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧2020-12-12
WebUploader是由Baidu WebFE(FEX)團隊開發(fā)的一個簡單的以HTML5為主，F(xiàn)LASH為輔的現(xiàn)代文件上傳組件。這篇文章主要為大家詳細介紹了Web Uploader文件上傳插件使用方法，感興趣的小伙伴們可以參考一下2016-05-05
本文給大家匯總介紹了javascript格式化日期時間的五種常用方法，個人對第五種個性化輸出時間比較有興趣，基本上只要項目中能用到都是使用第五種，推薦給小伙伴們。2015-06-06