前端開發中常用的陣列方法（一）

JavaScript提供了大量不同處理陣列的方法，這裡花幾分鐘介紹常用的幾個陣列方法。

1、Array.map()

map()方法返回一個新陣列，陣列中的元素未原始陣列元素呼叫函式處理後的值。

map() 方法按照原始陣列元素的順序依次處理元素。

示例一：

定義陣列：

const Material_Array=[
       {MaterialCode:'00061057',MaterialName:'運動襪',ColorName:'淺花灰/黑'},
       {MaterialCode:'00064060',MaterialName:'閃光揹包',ColorName:'寶藍/灰色'},
       {MaterialCode:'00066062',MaterialName:'拉托克揹包',ColorName:'黑色/灰'},
       {MaterialCode:'00069063',MaterialName:'單車揹包',ColorName:'紅色/灰'},
]
 

獲取所有陣列中貨品名稱：

const materials= Material_Array.map(e=>e.MaterialName)
console.log(materials)

執行結果：

0: "運動襪"
1: "閃光揹包"
2: "拉托克揹包"
3: "單車揹包"

2、Array.find()

find()方法返回通過測試（函式內判斷）的陣列的第一個元素的值。

find()方法為陣列中的每個元素都呼叫一次函式執行。

• 當陣列中的元素在滿足條件時返回true時，find()返回符合條件的首次發現的元素，其餘的元素不執行。
• 如果沒有滿足條件的元素返回undefined。

示例：

const material =Material_Array.find(e=>e.MaterialCode=='00061057')
console.log(materials)

執行結果：

{MaterialCode: "00061057", MaterialName: "運動襪", ColorName: "淺花灰/黑"}

3、Array.every()

every()方法用於檢測陣列所有元素是否都符合指定條件。

every()方法使用指定函式檢測陣列中的所有元素。

• 如果陣列中檢測到有一個元素不滿足，則整個元素返回false,並且不執行以後元素的檢測。
• 如果所有元素都滿足條件，則返回true。

示例：

const material=Material_Array.every(e=>e.MaterialCode=="00061057")
console.log(material)

執行結果：

false

4、Array.some()

some()方法用於檢測陣列中的元素是滿足指定條件（函式提供）。

some()方法會依次執行陣列的每個元素。

• 如果有一個元素滿足條件，則表示式返回true,剩餘的元素不會再執行檢測。
• 如果沒有滿足條件的元素，則返回false。

 const has=Material_Array.some(e=>e.MaterialCode=="00061057")

執行結果：

true