陣列(Array)

陣列是一個物件(object)包含數個元件，可能是變數或物件，通常我們在陣列中存放相同型態的資料，雖然這裡並不限制我們放置不同型態的資料。 陣列會有index，就好像門牌號碼，我們可以根據這個編號得到或修改其中的資料。如前一章所述，當我們要宣告一個陣列時，可以使用中括號[]，如下例: var a = [1,2,3]; console.log(a[0]); 其實這個陣列等同於我們宣告了三個變數。我們可以經由其編號得到其中的內容，使用中括號及其index，結果顯示1，可以知道編號由0開始。可以想見若是要改變其中的值，只要使用
a[1] = 200; console.log(a[1]); 可以看到a[1]的值被改變了。其實我們只是宣告了a[0],a[1],a[2]三個變數不是嗎?
如前一章所述，因為陣列其實是一個物件，所以也可以使用以下方式來宣告。 var fruits = new Array('apple', 'banana', 'carrot'); console.log(fruits[2]); 若是嘗試印fruits[3]會發生甚麼事?若是將fruits[2]改為fruits又會印出甚麼?
其實array的index也可以不需要是整數，例如下例: var node = []; node["x"] = 100; node["y"] = 200; node["demand"] = 50; console.log(node.length + "\t" + node["x"] + "\t" + node["y"] + "\t" + node["demand"]); 雖然能使用不過可以發現結果顯示node.length變成0，若是用數字的index則不會發生這個情形，所以與其這樣使用還不如做成一個物件。

陣列屬性

---

Array最常用的屬性大概就是長度(length)，我們可以使用陣列名稱.length來得到其長度，也就是元素個數。可以使用此屬性來tranverse整個array。例如: for (let i = 0; i < fruits.length; i++){ console.log(fruits[i] + "\t"); }
也可以使用如之前traverse物件的方式，使用in關鍵字，例如: for (i in fruits){ console.log(fruits[i] +"\t"); } 這跟我們的期待有點落差，本以為i便是array內物件，所以印i即可，結果i卻是index，所以要印fruits[i]。其實應該這樣:
for (i of fruits){ console.log(i + "\t"); } 使用of關鍵字即可。 也可以使用以下方式:
fruits.forEach( function(e){ console.log(e); } ); forEach函數就是對於array內每一個元素(e)的意思，也可以改寫為使用=>，如下: fruits.forEach( (e)=>{console.log(e);} ); 這幾個方式可以讓我們巡迴整個array。

陣列方法(methods)

---

JavaScript提供數個methods供我們操縱array，計有:

1. concat(): 合併兩個array。 >>
   var cars = ["Benz", "BMW", "Ferrari", "Porsche", "Lamborghini"]; var owners = ["Alex", "Boney", "John", "Tom", "Sean"]; var carowner = cars.concat(owners); console.log(carowner);
2. every(): 檢查array中每一個元素，傳回boolean。 >>
   function less20(e){ return e < 20; } var n = [3,6,11,2,18]; console.log(n.every(less20)); 也可以將函數簡寫為如下: console.log( n.every( (e)=>{return e<20;} ) );
3. filter(): 傳回新的array包含舊array中符合某標準的所有元素。 >>
   function less10(e){ return e < 10; } console.log(n.filter(less10)); 或是 console.log( n.filter( (e)=>{return e < 10;} ) );
4. forEach(): 針對array中每一個元素。之前介紹過，再加個例子。 >>
   n.forEach( (e, i)=>{console.log(i + " - " + e)} //(e,i)=>{n[i] = e*e;} // try this ) 第二個參數是index。
5. indexOf():傳回第一個相符元素的index，若不包含傳回-1。 >>
   console.log(n.indexOf(6));
6. join(): 將所有元素加成一個字串。 >>
   console.log(n.join());
7. lastIndexOf(): 跟indexOf()，只是由後往前搜尋，若是有重複的元素指傳回第一個找到的位址。
8. map(): 傳回一個新array，其中元素為舊元素傳入某一函數後之傳回。 >>
   console.log(n.map( (e) => {return e*e;} ));
9. pop(): 移除array的最後一個元素並傳回該元素。 >>
   console.log(n.pop() + "\n" + n);
10. push(): 在array後面加上一個或多個元素並傳回新array的length。 >>
    console.log("length = " + n.push(18, 22) + "\n" + n);
11. reduce():將一個函數每次應用至兩個元素使其成為一個元素，依次應用至array所有元素，最後回傳一個值。看起來多拗口，看以下例子。 >>
    function add(e1, e2){ return e1+e2; } console.log(n.reduce(add)); 看例子就好理解得多，將array中前兩個數字加起來，再將和與下一個數字相加，這樣一直到array中所有元素都被加上去，最後得到一個數字也就是所有元素之和。
    試試看這個code。 console.log( n.reduce( (e1,e2)=>{return e1*e2;} ) );
12. reduceRight(): 跟reduce()一樣，只是方向相反，由右向左。 >>
    console.log( n.reduce( (e1,e2)=>{return e1*e2;} ) );
13. reverse(): 將array中的元素順序倒轉。 >>
    console.log(n.reverse()); 這個結果跟上一個例子似乎相同，實際上上一個例子只是倒過來印出，這個例子是改變了array的內容，也就是此時n[0]變成了原來的最後一個元素。
14. shift(): 跟pop()相反，此為移除第一個元素並傳回該元素。 >>
    console.log(n.shift() + "\n" + n);
15. slice(): 將array的一部分切片形成一個新的array並傳回。 >>
    console.log(n.slice(1,3) + "\n" + n); 傳回[n[1], n[2]](第二個數字位址不包含)，而原array不變。
16. some(): 如果array內至少一個元素符合特定函數標準，傳回true，否則傳回false。 >>
    console.log( n.some( (e) => {return e > 10;} ) ); 跟every()類似，只是every()需要所有元素都符合才傳回true。
17. sort(): 排序array。
    • >>
      n.sort(); console.log(n); 顯示出的結果是[11, 18, 2, 3, 6]，好像不太對，事實上是排序好了，只是不是照數字大小，而是字串大小。
    • 若是要排序數字，需要加上一個函數。 >>
      function compare(e1, e2){ return e1 > e2; } n.sort(compare); console.log(n);
    • 若是想要由大到小排序，可以修改函數，或是記得之前介紹的reverse()函數?
    • 若是要排序的是物件?只要把比較函數修改一下即可。 >>
      function sedan(brand, amount, description){ this.brand = brand; this.amount = amount; this.description = description; this.info = function(){ return this.brand + " " + this.amount + " " + this.description; } }// constructor var sedans = [];//create array sedans.push(new sedan("Porche", 5, "Expensive")); sedans.push(new sedan("BMW", 5, "Expensive")); sedans.push(new sedan("Lamborghini", 5, "Expensive")); sedans.push(new sedan("Benz", 5, "Expensive")); sedans.push(new sedan("Farrari", 5, "Expensive")); var compareSedan = function(s1, s2){ // compare function if (s1.brand > s2.brand){ return 1; }else if(s1.brand < s2.brand){ return -1; }else{ return 0; } } console.log(sedans.sort(compareSedan)); // sort 首先建立物件的constructor，然後建立array，使用之前介紹的push()方法將物件加入，再建立一個比較函數，然後就可以排序了。
    • 若是要找array中的最大或最小，可以直接排序然後找第一個(或最後一個或使用reverse())即可。不過這樣比較沒效率，只是要找一個值，也可以使用如下: console.log(Math.max.apply(null, n)); 將數學函數Math.max(或Math.min)應用到array上。不過這只適用於array內的元素不太多的情況，所以可以使用如下方式。 >>
      function bigger(e1, e2) { return Math.max(e1, e2); } console.log(n.reduce(bigger)); 利用之前教過的reduce()函數，一路檢查array到底然後保留最大的。
    • Shuffle: 將array內的元素打亂。例如撲克牌洗牌，可以使用sorting方法。 >>
      console.log( n.sort( (e1, e2) => {return Math.random() - 0.5;} ) ); 每一次重載網頁可以看到陣列的排列順序都不同，Math.random()函數會傳回0-1之前的隨機數，將在後面的章節介紹。
18. splice(): 加入或刪除array內的元素。 >>
    console.log(n); n.splice(2,2,20,30,40,50,60); console.log(n); 參數的意義是自index=2開始(第一個參數)刪除兩個元素(第二個參數)，並在同位置加上後面所有元素(其餘的所有參數)。
19. toString(): 傳回元素內容字串。 >>
    console.log(n.toString());
20. unshift(): 跟shift()相反，在array前端加上一個(或多個)元素並傳回新array的length。 >>
    console.log(n.unshift(100,200) + "\n" + n.toString());

function's arguments

---

之前我們提到的函數，其輸入參數是一個物件，其中包含一個array，名稱為arguments。 >>
function area(w,h) { console.log(arguments); return w*h; } area(10,20); 呼叫方法後可以看到印出arguments這個陣列，其中包含了輸入的參數。我們可以利用這個陣列來直接對輸入參數做計算。 >>
function sum(){ var s = 0; for(let i = 0; i < arguments.length; i++){ s = s + arguments[i]; } return s; } console.log(sum(1,2,3,4,5,6,7,8,9,10)); 練習寫一個函數找出輸入參數的最大值。