自學日記

學習程式相關知識及學習法

0%

JS- 進階陣列

JavaScript 進階陣列

tags: JavaScript

陣列處理在JS中屬於重要的資料處理的一環,此處進行大致的整理,幫助自己在資料處理上更熟悉。

map()

當我們需要將 array 中所有元素轉換成另一種形式的資料的時候,可以使用 map()。
map 接受一個 callback 函式作為參數,callback 需回傳轉換後的元素:

1
2
3
4
let result = array.map(function(item, index, array) {
// Do something...
return result;
})

map 跟 forEach 最大的差異在於,forEach 不會有回傳值,但 map 會回傳一個全新的 array。

如果你不需要對資料作轉換,例如:印出字串等不會回傳值的情況,就用 forEach;如果你需要資料轉換之後的結果,就用 map。

filter()

filter()會回傳一個陣列,其條件是 return 後方為 true 的物件,很適合用在搜尋符合條件的資料。
filter 用來「過濾出陣列中符合條件的元素」,會回傳一個 array。

1
var newArray = arr.filter(callback(element[, index[, array]])[, thisArg])

find()

find()filter() 很像,但 find() 只會回傳一次值,且是第一次為 true 的值。
find 用來「找出陣列中第一個符合條件的元素」,回傳值是一個元素或 undefined。

和 filter 的不同之處在於,filter 會回傳包還所有符合條件的項目的「陣列」,而 find 會回傳第一個符合條件的「項目」。

forEach()

forEach 可以對陣列中的所有元素執行特定操作。不需要回傳值(return)

1
2
3
arr.forEach(function(item, index, array) {
// Do something
});

every()

every 用來測試陣列中的所有項目是否符合某個條件,回傳值是布林。

some()

some 用來測試陣列中是否存在至少一個項目符合某個條件,回傳值是布林。

some 和 every 的差別是,every 必須「所有」的項目都符合條件才會回傳 true,some 只要其中一個項目符合條件就會回傳 true。

reduce()

reduce 的功能是將陣列中的所有項目合併成一個值。

reduce 的 callback 參數接受兩個參數,分別為:

  • accumulator:目前累積的值
  • item:目前項目

參考資料:
https://shubo.io/javascript-array-methods/
https://www.casper.tw/javascript/2017/06/29/es6-native-array/