# [JavaScript] Array陣列常用語法 ###### tags: `JavaScript` [參考資料](https://www.ucamc.com/e-learning/javascript/261-javascript-reduce%E3%80%81foreach%E3%80%81filter%E3%80%81map) * forEach:遍歷每個元素。 * map:遍歷每個元素,回傳的值會替代原本陣列內的值。 * filter:遍歷每個元素,回傳 true 時,目前的值會保留在陣列內,這會回傳一個新陣列,而不是修改原本的陣列。 * reduce:遍歷每個元素,依序組合、加總,然後丟給下個元素,最終會回傳一個結果。 ### forEach forEach:遍歷每個元素,函式執行每個陣列內的物件或值 陣列名稱.forEach(function(數值item ,索引index , 原陣列array){}) ``` this.todos.forEach(function(item){ if(item>2){ console.log(item) }} //在this.todos陣列裡,使用item的資料做迴圈判斷 ``` 在陣列內新增cash項目,並套用原momey數值+500 ``` people.forEach(function(item,index,array){ item.cash = item.money + 500 console.log(item) }); ``` ### map 與foreach的差異是map會有return指向新的陣列裡,但不影響原陣列的數值 需產生新的陣列newpeople,放入函數內所新增的變數,return代表會回傳一個值到新陣列上 ![](https://i.imgur.com/mEpykWe.png) >...item表示為陣列裡的所有值,逗號後是結合後方的新變數 ### Filter 這個按照字面上的意思來說就是過濾器,filter 不會修改值,但他會幫你決定要不要將這個值留在陣列裡面,要注意的是 filter 會回傳一個新的陣列,而不是修改原本的陣列。 相較於map不同的是filter會從原陣列裡篩選原有的數值至新陣列上,而非新增新的變數。 ``` var arr = [1, 2, 3, 4], newArr = []; for(var i = 0; i < arr.length; i++) { if(arr[i] > 2) { newArr.push(arr[i]); } } console.log(newArr); // [3, 4] ``` () =>{} 就是ES6的函式簡寫function(){} ``` var arr = [1, 2, 3, 4]; var newArr = arr.filter((val) => { return val > 2; }) console.log(newArr); // [3, 4] ``` 回傳值true意指回傳判定後的答案 ![](https://i.imgur.com/URt1JuG.png)