前端開發中常用的數組方法（一）

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