# 陣列系列操作 map 、 forEach 、 filter 、find 、 findIndex 的差別

// Js array map
// 1.能將原始陣列運算後，重新組合回傳一個新陣列
// 2.不會影響到原陣列
// 3.適用時機:處理一整個陣列，並回傳到一個新陣列。

let date =[1,94,26,64,72]; //原陣列不受影響

let newData1 = date.map(function(item){
let obj = {};
obj.checked = item > 50;
return obj;//使用此函式寫法，一定要加上 return 回傳結果
});

//上述第9項到13項為處理過的 新陣列 ( newData1 )。

console.error(newData1); //[false,true,false,true,true] --出來的是布林值
console.error(date);
//----------------------------------------------------

// Js array forEach
// 1.**無法**將原始陣列運算後，重新組合回傳一個新陣列
// 2.不會影響到原陣列
// 3.適用時機:將資料一筆一筆做出來 OR 組成HTML字串。
// 4.無法透過 return 中斷

let date =[1,94,26,64,72];

let arr = []; //自創空陣列

date.forEach(function(item){
let obj = {};
obj.content = item > 50;
arr.push(obj);
})

console.log(arr); // 新陣列
console.log(date);

//----------------------------------------------------

// Js array filter 篩選
// 1.篩選出符合條件的內容值後，重新組合回傳一個新陣列
// 2.不會影響到原陣列
// 3.適用時機:用在下拉選擇市區 OR 比價 OR 篩選及格分數出來 。

let date =[1,94,26,64,72];

let newData1 = date.filter(function(item){
return item > 50;//使用此函式寫法，一定要加上 return 回傳結果
});

console.log(newData1); // [94, 64, 72] --出來的是值

//----------------------------------------------------

// Js array find 篩選
// 1.篩選出符合條件的內容值後，回傳**第一筆**符合的條件內容值
// 2.不會影響到原陣列
// 3.適用時機:尋找頭一筆資料的時候。

let date = [5,60,78,34,62,94];

let newArr = date.find(item => {
console.log(item) // 只會將 date 的陣列資料跑兩次也就是回饋 5 跟 60 的值，其主要是 find 只要找到第一個符合的值，就直接 return 找到的資訊，就不會繼續往下找了，也就是說當找到 item >= 30 (也就是當 60 為第一個滿足點)，就不往後跑 78、34、62、94的值了。--->此前提是 已設定條件:(return item >= 30)才會發生此情況。

return item >= 30;//使用此函式寫法，一定要加上 return 回傳結果
})

console.warn(date); //[5, 60, 78, 34, 62, 94]
console.log( newArr); // 60

※ 缺點: 假設上述篩選；若是想要篩選 陣列中 34 的資料時，是無法被選取到的，其因為 [設定的條件是: return item >= 30]，故在選取頭一筆資料時，在遇到 陣列中 60 的資料，就已經符合設定條件，所以會優先回傳 60 的資料。

//----------------------------------------------------

// Js array findIndex 篩選
// 1.篩選出符合條件的**索引值**後，回傳第一筆符合的 **索引** 編號
// 2.不會影響到原陣列
// 3.適用時機: 查詢並篩選 訂單編號的資料。

let order = [
{
name:'小劉',
orderId:11698120
},
{
name:'小陳',
orderId:36985410
},
{
name:'小鍾',
orderId:12034569
}
]

let newObj = order.findIndex(index=>{
console.warn(index); // 只會將 order 的陣列資料跑兩次也就是回饋 小劉 跟 小陳 的物件資料，其主要是 findIndex 只要找到第一個符合的值，就直接 return 找到的資訊，就不會繼續往下找了，也就是說當找到 index.orderId == '36985410' (就是 orderId == '36985410'為第一個滿足點)，就不往後跑 小鍾的物件資料了。--->此前提是 已設定條件:(return index.orderId == '36985410')才會發生此情況。

return index.orderId == '36985410';//使用此函式寫法，一定要加上 return 回傳結果
})

console.log(newObj); // 回傳 索引值 第1筆資料
console.log(`這筆訂單是${order[newObj].name}`);//這筆訂單是小陳