# 陣列方法

資料如下:

const people = [
    {
        name:'卡斯伯',
        order:'鍋燒意麵',
        price: 80
    },
    {
        name:'小明',
        order:'牛肉麵',
        price: 120
    },
    {
        name: '漂亮阿姨',
        order: '滷味切盤',
        price: 40
    },
    {
        name:'Ray',
        order:'大麻醬乾麵',
        price:60
    },
];

陣列索引位置:
> forEach 是這幾個陣列函式最單純的一個，不會額外回傳值，只單純執行每個陣列內的物件或值。
forEach不能跳出迴圈，for才可以。

> 使用 map() 時他需要回傳一個值，他會透過函式內所回傳的值組合成一個陣列。

> filter() 會回傳一個陣列，其條件是 return 後方為 true 的物件，很適合用在搜尋符合條件的資料。

> findIndex() 方法將依據提供的測試函式，尋找陣列中符合的元素，並返回其 index（索引）。如果沒有符合的對象，將返回 -1 。

> reduce() 方法將一個累加器及陣列中每項元素（由左至右）傳入回呼函式，將陣列化為單一值。

> sort() 方法會原地（in place）對一個陣列的所有元素進行排序，並回傳此陣列。排序不一定是穩定的（stable）。預設的排序順序是根據字串的 Unicode 編碼位置（code points）而定。

參數包含三個:物件, 索引, 全部陣列，可以只寫物件和索引，全部陣列很少用到
### 1. 一一列出每個人的訂單

people.forEach(function(obj,key){
  console.log(obj,key);
});


### 2. 將所有訂單新增一個新價格，全部是80%
#### 1.使用forEach

const newOrders = [];
people.forEach(function(obj, key){
  newOrders[key] ={ //索引位置
    ...obj,       //展開
    newPrice:obj.price *0.8 //新價格
  }
});
console.log(newOrders);

#### 2.使用map

const newOrders = people.map(function(item){
return {
...item,
newPrice:item.price * 0.8
}
});
console.log(newOrders);

#### 3.map更進階寫法(箭頭函式)

const newOrders = people.map(item => ({
    ...item,
    newPrice: item.price * 0.8
}))
console.log(newOrders);

### 3. 80元以上可以給滷蛋
#### 1. 使用forEach

const newOrders2 =[]; //沒有調整
people.forEach(function(item, index){ //參數可以自己命名
  if(item.price>=80){
    newOrder2.push(item)
  }
});

#### 2.使用filter

const newOrder2 = people.filter(function(item, index){
  return item.price >=80 //為真的，就會回傳物件
});
console.log(newOrder2);

#### 3.使用filter+箭頭函式

const newOrders2 = people.filter(item => item.price >=80);
console.log(newOrders2);

### 4. 老闆發現牛肉沒了，把點牛肉麵換成牛肉湯麵
#### 1.forEach

let index= 0  //let的數值會被調整
people.forEach(function(obj,key){
  if (obj.order ==='牛肉麵'){
    index = key;
  }
});
people[index].order = '牛肉湯麵' //用中括號尋找索引位置
console.log(people[index]);

#### 2.findIndex

const index = people.findIndex(function(item){
return item.order ==='牛肉麵';
})
people[index].order = '牛肉湯麵';
console.log(people[index]);

#### 3.findIndex+arrow

const index = people.findIndex(item => item.order ==='牛肉麵')
people[index].order = '牛肉湯麵'
console.log(people[index]);

### 5. 老闆說POS機壞了，麻煩幫忙出一下LI結構，方便列印發票
#### 1.forEach

let htmlTemplate = '' //樣板字面值
people.forEach(function(obj,key){
  htmlTemplate = htmlTemplate +`<li>//累加
  ${obj.order},${obj.price} //將變數丟進去
  </li>`;
});
console.log(htmlTemplate);

#### 2.map

const htmlTemplate = people.map(function(obj,key){
retrun `<li> 
   ${obj.order}, ${obj.price} 
  </li>` 
}).join('');//陣列轉字串
console.log(htmlTemplate);

#### 3.map加箭頭函式

    const htmlTemplate = people.map((obj,key) =>`<li> 
    ${obj.order}, ${obj.price} 
    </li>` ).join('');//陣列轉字串
    console.log(htmlTemplate);

### 6. 老闆要收錢了，請問老闆應該收多少錢
#### 1.forEach

let total = 0;
people.forEach(function(obj,key){
  total += obj.price;
})

console.log(total);

#### 2.reduce
陣列前後有相關的時候用reduce

let total = people.reduce(function(acc,cur){ //acc之前的值，cur當前的值
   return acc+cur.price;
}, 0);

console.log(total);
 

#### 3 reduce+箭頭

const total = people.reduce((acc,cur)=> acc+cur.price,0);
console.log(total);

### 7.今天誰吃最貴! 請排序所有金額
sort為兩兩比較的結果

const peopleSort = people.sort((a, b) =>{ //a,b兩兩比較
  return a.price -b.price //ab顛倒則排序由大到小
});
console.log(peopleSort);