頁面連結：Array Cardio Day 1 (請開啟 console 看結果)

今天稍微輕鬆一點，不會寫出程式來，而只是複習一下 array 的各種 method 而已～那我們就一個一個開始看吧！

首先我們有下列 array 要做排序

const inventors = [
  { first: 'Albert', last: 'Einstein', year: 1879, passed: 1955 },
  { first: 'Isaac', last: 'Newton', year: 1643, passed: 1727 },
  { first: 'Galileo', last: 'Galilei', year: 1564, passed: 1642 },
  { first: 'Marie', last: 'Curie', year: 1867, passed: 1934 },
  { first: 'Johannes', last: 'Kepler', year: 1571, passed: 1630 },
  { first: 'Nicolaus', last: 'Copernicus', year: 1473, passed: 1543 },
  { first: 'Max', last: 'Planck', year: 1858, passed: 1947 },
  { first: 'Katherine', last: 'Blodgett', year: 1898, passed: 1979 },
  { first: 'Ada', last: 'Lovelace', year: 1815, passed: 1852 },
  { first: 'Sarah E.', last: 'Goode', year: 1855, passed: 1905 },
  { first: 'Lise', last: 'Meitner', year: 1878, passed: 1968 },
  { first: 'Hanna', last: 'Hammarström', year: 1829, passed: 1909 }
];

1. Filter the list of inventors for those who were born in the 1500's 將出生於 1500年代的 inventors 列出
   這題可以透過 map + includes 的方式做出，但我想嘗試用 filter 實做看看

const born1500 = inventors.filter(cur => cur.year < 1600 && cur.year > 1499);

filter會依我們給的條件 return 過濾後新的 array

2. Give us an array of the inventors' first and last names 用一 array 列出 inventors 的名 + 姓
   這題可以使用 map 得到新的 array

const fullNames = inventors.map(person => `${person.first} ${person.last}`);

3. Sort the inventors by birthdate, oldest to youngest 依照出生時間點排序(由久遠到近代)
   sort內要帶入一個 callback function，在裡面會有 a, b 作比較；可以將 a, b 理解成該項與後一項做比較：

• 若比較後得到的值大於 0，則 a 會被排序在 b 後面
• 若比較後得到的值小於 0，則 a 會被排序在 b 前面
• 若比較後得到的值等於 0，則 a 與 b 排序不變

這題使用sort寫出來會是：

const sortedBirthdates = inventors.sort((a, b) => a.year - b.year);

另一個方法是用if...else來判斷a.year & b.year大小並 return 不同的值

const sortedBirthdates = inventors.sort((a, b) => a.year > b.year ? 1: -1);

4. How many years did all the inventors live? 加總全部 inventors 的年齡
   要把 array 得出一個值，那要用什麼方法最方便？沒錯就是reduce啦！

const totalLiveYears = inventors.reduce((total, cur) => total + (cur.passed - cur.year), 0);

reduce要帶入一個 callback function 以及初始值，callback 帶入的參數比較特別，第一個參數是加總值，第二個參數是當前項目；初始值若無指定則會是 array 的第一項(第一個參數一開始的值會是指定的初始值)

5. Sort the inventors by years lived 依照在世年齡排序
   這期與前面的題目類似，使用sort來做排序

const sortedAges = inventors.sort((a, b) => (a.passed - a.year) - (b.passed - b.year));

6. 首先先到這個網站，接著我們要過濾出 Boulevard 名字內有 "de" 的項目
   首先先找出所有含有名字的a連結

const links = Array.from(document.querySelectorAll('.mw-category a'));

因為querySelectorAll的結果是nodeList，所以要轉成Array才能使用Array的 methods

接著利用textContent取出名字

const names = links.map(cur => cur.textContent);

然後再使用熟悉的filter搭配includes過濾我們要的內容

const de = names.filter(cur => cur.includes('de'));

完成！

7. 首先我們有一串陣列的人名，而我們要依照姓氏字母順序排序

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'];

但其實目前已經照姓氏排好了(所有 B 開頭的字)，所以我們改用名字(given name)排序吧！

說到排序就會想到sort，首先要先取出名字才能進行比較，但要怎麼從字串取出值並轉成陣列？

沒錯，就是使用split！可以看到陣列每一項的共通點就是都有逗號和空格，所以可以這樣寫

const split = people.map(person => person.split(', '));

在每一個陣列項目中會由原本完整的名字變成一個陣列(分別有 2 個項目)

接著用sort比較字元位置；順道一提，字串間也是可以做比較的，大家可以試試看在 console 比較，例如'a' < 'b' // true，中文字也可以比較喔！
所以我們會比較字元 (a, b) 的大小，若 a > b，return 1，反之 return -1

const sortedLastnames = split.sort((a, b) => a[1] > b[1] ? 1: -1)

到這裡已經算排序出我們想要的順序了，但上一步驟將字串轉成陣列，現在我們要恢復原狀

const answer = sortedLastnames.map(cur => cur.join(', '));

大功告成～

Reference

• Array.prototype.reduce()
  
• Array.prototype.sort()
  
• Get all unique values in a JavaScript array (remove duplicates)
• How to count duplicate value in an array in javascript