從多個方面深入理解JS獲取數組最後一個元素

一、基礎的方法

獲取數組最後一個元素在JS中是一個非常簡單的操作。我們可以使用數組的length屬性來獲取數組長度，然後直接通過索引獲取最後一個元素。

    const arr = [1, 2, 3, 4, 5];
    const lastElement = arr[arr.length - 1];
    console.log(lastElement); // 5

這個方法在日常開發中非常常見，但是我們也需要注意它的缺點。使用這個方法需要在內存中額外創建一個變量，因為arr.length的獲取需要遍歷整個數組。此外，這種方式在處理數組為空的時候會報錯。因此，我們需要使用if語句來進行判斷，而這樣會增加代碼量。

ES6為我們提供了一些更高效的語法，讓我們可以更加輕鬆地獲取數組中的最後一個元素。其中一種方法是使用解構賦值的方式將數組中的最後一個元素賦值給新的變量。

    const arr = [1, 2, 3, 4, 5];
    const [ , , , , lastElement] = arr;
    console.log(lastElement); // 5

這種方式被稱為數組解構，代碼看起來更加簡潔，但是需要注意解構賦值的方式必須要對數組的前幾個元素進行賦值操作，因為我們需要使用逗號進行佔位。

我們也可以使用Array的slice方法獲取最後一個元素。這個方法將會返回一個新的數組。

    const arr = [1, 2, 3, 4, 5];
    const lastElement = arr.slice(-1)[0];
    console.log(lastElement); // 5

這種方法代碼量比較少，而且效率也相對較高。但是在大多數情況下，我們只需要獲取最後一個元素，這種方法有些浪費，因為它會返回一個新的數組。

使用pop方法將會直接修改原有的數組，返回刪除的最後一個元素。

    const arr = [1, 2, 3, 4, 5];
    const lastElement = arr.pop();
    console.log(lastElement); // 5
    console.log(arr); // [1, 2, 3, 4]

這種方法代碼極為簡潔，可以直接獲取並刪除最後一個元素。但是如果我們不需要修改原有的數組，就不能使用pop方法。

在日常開發中，我們需要對比不同方法的性能並選擇最適合的方法。

我們使用下面的代碼和Chrome DevTools的工具來進行性能測試。

    const arr = new Array(1000000).fill("test");

測試結果如下：

我們可以看到，pop方法是所有方法中性能最好的，同時它也非常簡潔。因此，在日常開發中我們可以優先考慮使用pop方法來獲取數組最後一個元素。

本篇文章詳細介紹了js獲取數組最後一個元素的五種方式。每種方式都有其優劣，我們可以根據具體的情況選擇最適合的方式。我們還使用性能測試的方式對這幾種方式進行了對比，pop方法在性能方面是最優的，同時也非常簡潔。

原創文章，作者：GMPMI，如若轉載，請註明出處：https://www.506064.com/zh-hk/n/371754.html