TAG: Array.length Array.prototype.reverse() Array.prototype.slice() Array.prototype.pop()
Array對象 - pop( )
pop() 方法用於刪除數組的最后一個元素並返回刪除的元素，要點 - 獲取並刪除。
let arr = [0, 1, 2, 3] let element = arr.pop() console.log('arr: ', arr, ' & arr.length: ', arr.length) // arr: [0, 1, 2] & arr.length: 3 console.log('element: ', element, ', type: ', typeof(element)) // element: 3, type: Number
通過 擴展運算符 來執行pop方法，獲取數組最后一個元素的同時不會改變它本身。
var arr = [0,1,2,3] var element = [...arr].pop() console.log('arr: ', arr, ', element: ', element) // arr: [0, 1, 2, 3], element: 3 console.log('arr.length: ', arr.length, ', type: ', typeof(element)) // arr.length: 4, type: Number
數組的實質就是開辟一個棧內存並指向堆中的一個連續的儲存空間，而 [...arr] 從邏輯上來講就是占用一節新的棧內存並在堆內存中存放一個新的數組，而不僅僅是分配一個新的棧並指向已有的堆內存數組，把arr在語法層面展開，所在堆棧的值迭代淺拷貝到新的棧內存並指向新的堆內存中。
需要特別注意的是擴展運算符與 Object.assign( ) 語法相同，都是淺拷貝一層，如果是多維數組就出現問題了。
var a = [[1], [2], [3]] var b = [...a] b.shift().shift() // 1 // 這樣做數組a也受到了影響！ console.log(a) // [[2], [3]]
如果想深入探究擴展運算符的底層邏輯和擴展使用，建議研讀MDN提供的文檔 MDN展開語法。
Array對象 - slice( )
slice() 方法可從已有的數組中返回選定的元素。
let arr = [0, 1, 2, 3] let element = arr.slice(-1) console.log('arr: ', arr, ', element: ', element) // arr: [0, 1, 2, 3], element: 3
Array對象 - reverse( )
reverse() 方法用於顛倒數組中元素的順序。
let arr = [1, 2, 3] let [element] = arr.reverse() console.log(elelment) // 3 console.log(arr) // [3, 2, 1]
可以看到該方法雖然也可以拿到最后一個元素但同時也會改變數組本身。
巧用擴展運算符，就可以達到不改變數組本身獲取最后一個元素的目的。
let arr = [1, 2, 3] let [arg] = [...arr].reverse() console.log(arg) // 3 console.log(arr) [1, 2, 3]
Array屬性 - length
length 屬性可設置或返回數組中元素的數目。
let arr = [0, 1, 2, 3] let element = arr[arr.length - 1] console.log('arr.length: ', arr.length, ', element: ', element) // arr.length: 4, element: 3
我的其他相關文章：
JS005. 拷貝引用數據類型Array使其指向不同堆的解決方案
ES6：使用解構賦值僅用一行定義多個相同的數組，且指向堆不同（解構賦值）