作為一個(gè)前端工程師，數(shù)據(jù)的處理能力必然是很重要的。對(duì)于常見的數(shù)組，想要獲取其中的第N個(gè)元素，究竟有多少種方法呢?

比如，我們要獲取數(shù)組 array 的 第 3 個(gè)元素。

const array = [ 
  { id: 1, name: 'Mario' },  
  { id: 2, name: 'Doom'},  
  { id: 3, name: 'Jack'}, 
  { id: 4, name: 'Yvette'} 
] 

1. for 循環(huán)

最簡單的當(dāng)然是 for / forEach 循環(huán)啦。

let result; 
for (let index = 0; index < array.length; index++) { 
  if (index === 2) { 
    result = array[index]; 
  } 
} 

2. Array.prototype.forEach

forEach 不用多介紹，相信大家都知道。這里使用 forEach，而不選中 map 的原因很簡單，因?yàn)檫@里不需要返回一個(gè)新的數(shù)組，甚至也不需要返回值，而且 forEach 還可以中斷。如果是一個(gè)超級(jí)大大大數(shù)組，優(yōu)勢就出來了。

let result; 
array.forEach((item, index) => { 
  if(index === 2) { 
    result = item; 
    return; 
  } 
}); 

3. Array.prototype.find

find 和 forEach 應(yīng)該都是大家比較常用的方法了。find 返回的是數(shù)組中第一個(gè)滿足條件的元素，用在這里也合適。

const result = array.find((item,index) => index === 2); 

4. Array.prototype.slice

slice 于我而言，沒有 find 和 forEach 用得頻繁。最最最關(guān)鍵的是，每次用 slice 之前，我都會(huì)把 splice 在心里想一遍去確認(rèn)，討厭這種超級(jí)相近的單詞。

slice 返回的是一個(gè)數(shù)組，slice(start, end)，如果不傳 end 的話，就返回從 start一直到數(shù)組末尾。

const result = array.slice(2,3)[0]; 

如果 start 是負(fù)數(shù)的話，那么就會(huì)從數(shù)組的末尾開始，比如，獲取數(shù)組的最后一個(gè)數(shù)：

const lastOne = array.slice(-1)[0]; 

獲取數(shù)組的倒數(shù)第二個(gè)數(shù)：

const lastSecond = array.slice(-2, -1)[0]; 

如果有人跟我一樣，對(duì) slice 和 splice 這種超級(jí)單詞超級(jí)像的方法會(huì)有點(diǎn)傻傻分不清的話，我是這樣去區(qū)分的：

splice 比 slice 多個(gè) p，而 splice 會(huì)改變?cè)瓟?shù)組，一般會(huì)修改原數(shù)組的方法都不是我的首選，所以這個(gè)多出來的這個(gè) p 真的就是個(gè) P。

記這些東西真的好難，哈哈哈哈，尤記當(dāng)年記 “上北下南，左西右東”時(shí)，前半句我一直沒有問題，后半句，我總是不分期是“左西右東”，還是“左東右西”，后來，我自己總結(jié)了下，封口的要對(duì)不封口的，不封口的要對(duì)封口的，“左”不封口，所以它要跟一個(gè)封口的“西”，“右”是封口的，所以它和“東”在一起，從此之后，我就再也沒有高混過了。

5. Array.prototype.at

數(shù)組原型新增的方法，個(gè)人認(rèn)為這是最最最方便的方法了。和 slice 不同，它返回的就是第N個(gè)元素。

const result = array.at(2); 

和 slice 類似，如果入?yún)⑹秦?fù)數(shù)的話，那么將會(huì)從數(shù)組的末尾開始。

例如，獲取最后一個(gè)元素:

const lastOne = array.at(-1); 

獲取倒數(shù)第二個(gè)元素：

const lastSecond = array.at(-2); 

用它用它用它。

6. lodash 的 nth

如果你項(xiàng)目中使用了 lodash 的話，那么 nth 當(dāng)然也是一個(gè)很好的選擇。

import { nth } from 'lodash'; 
const result = nth(array, 2);