今天要介紹 Array 常用的 methed，廢話不多說，先來介紹今天學到的一些技巧

.filter()

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

var filterEmpty = cars.filter(function(item, index, array){
});
console.log(filterEmpty);    // 沒有條件，會是一個空陣列

var filterPriceThan12 = cars.filter(function(item, index, array){
  return item.price > 12;       // 取得價錢大於12的
});
console.log(filterPriceThan12); // volvo XC60, benz c300 這兩個items

var filterEven = cars.filter(function(item, index, array){
  return index % 2 === 1;    // 取得陣列中雙數的物件
});
console.log(filterDouble);   // benz c300, toyota camy 這兩個items

map()

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

• 如果不回傳則是 undefined
• 回傳數量等於原始陣列的長度

這很適合將原始的變數運算後重新組合一個新的陣列。

var mapEmpty = cars.map(function(item, index, array){
});
console.log(mapEmpty);    // [undefined, undefined, undefined, undefined]
var mapPriceThan12 = cars.map(function(item, index, array){
  return item.price > 12;    // 比較price大於12的
});
console.log(mapAgeThan5); // [true, true, false, false]
var mapPriceThan12_2 = cars.map(function(item, index, array){
  // 錯誤示範
  if (item.price > 12) {
    return item;              // 回傳price大於12的
  }
  return false;               // 別以為空的或是 false 就不會回傳
});
console.log(mapPriceThan12_2);   // [{name: 'volvo XC60'...}, {name: 'benz c300'...}, false, false]

.sort()

.sort()會依照給的內容，兩兩比對，接著排序，預設是根據字串的 Unicode 碼排序，要注意的是sort()不會回傳一個新陣列，而是直接修改原陣列

arr.sort([compareFunction])

compareFunction(a, b) < 0
回傳值小於0，b的index高於a，a在b前面

compareFunction(a, b) = 0
回傳值等於0，a, b位置不變

compareFunction(a, b) > 0
回傳值大於0，b的index低於a，b在a前面

上面這個很重要

其實是這樣來的

function compare(a, b) {
  if (a is less than b by some ordering criterion) {
    return -1;
  }
  if (a is greater than b by the ordering criterion) {
    return 1;
  }
  // a must be equal to b
  return 0;
}

如果只單純比較數字大小

function compareNumbers(a, b) {
  return a - b;
}

則陣列由小排到大

function compareNumbers(a, b) {
  return b - a;
}

則陣列由大排到小

第七題
我們把人名用 .split(, ) 以,為界切開，接著使用 接著比較他們的 last name ，這裡只要true就是firstPeople比較大，因為要往後擺，所以回傳1。(記得上面說的大於0的結果)，反之亦然。

const people = ['Beck, Glenn', 'Becker, Carl', 'Beckett, Samuel', 'Beddoes, Mick', 'Beecher, Henry', 'Beethoven, Ludwig', 'Begin, Menachem', 'Belloc, Hilaire', 'Bellow, Saul', 'Benchley, Robert', 'Benenson, Peter', 'Ben-Gurion, David', 'Benjamin, Walter', 'Benn, Tony', 'Bennington, Chester', 'Benson, Leana', 'Bent, Silas', 'Bentsen, Lloyd', 'Berger, Ric', 'Bergman, Ingmar', 'Berio, Luciano', 'Berle, Milton', 'Berlin, Irving', 'Berne, Eric', 'Bernhard, Sandra', 'Berra, Yogi', 'Berry, Halle', 'Berry, Wendell', 'Bethea, Erin', 'Bevan, Aneurin', 'Bevel, Ken', 'Biden, Joseph', 'Bierce, Ambrose', 'Biko, Steve', 'Billings, Josh', 'Biondo, Frank', 'Birrell, Augustine', 'Black, Elk', 'Blair, Robert', 'Blair, Tony', 'Blake, William'];

const alpha = people.sort((firstPeople, secondPeople) => {
    const [aLastName, aFirstName] = firstPeople.split(', ');
    const [bLastName, bFirstName] = secondPeople.split(', ');
    return aLastName > bLastName ? 1 : -1; 
})
console.table(alpha);

reduce()

語法

arr.reduce(callback, initialValue)

reduce(function(){})會有2個參數： callback 函式和 initialValue

callback函式

callback函式會有4個引入值
accumulator、currentValue、currentIndex、array
initialValue則是設定accumulator的初始值

就拿今天的第八題來舉例吧！
我們的初始值是一個空陣列，每次在計算之前，我們都會去看空著列內有沒有該車種的 key ，如果沒有，就新增該車種的 key 並設定0輛，接著該車種數量計數加一。

const data = ['car', 'car', 'truck', 'truck', 'bike', 'walk', 'car', 'van', 'bike', 'walk', 'car', 'van', 'car', 'truck'];
const kind = data.reduce((counterObj, item) => {
    if (!counterObj[item]) {
        counterObj[item] = 0;
    }
    counterObj[item]++
    return counterObj;
}, {})
console.log(kind);

參考資料
Array.prototype.filter()
Array.prototype.map()
Array.prototype.sort()
Array.prototype.reduce()

JavaScript 陣列處理方法 [filter(), find(), forEach(), map(), every(), some(), reduce()]