陣列是什麼?
陣列（Array）是一種資料的集合，其中的值被稱之為元素，我的理解是，陣列就像是一個櫃子，裡面裝了性質類似的連續變數，他們使用同一個變數名字（櫃子名稱），用 索引值 來指定使用第幾個變數，且陣列基本上都是有序的，索引基本上都是由 0 開始！
陣列的宣告方式
var cabinet =Array();
var cabinet =[];
var cabinet =Array(10); //宣告 0 ~ 9 共 10 個的陣列，但現在裡面的東西是undefined
var cabinet =['red','yellow','black'];
讀取陣列中的元素
var fruits = ['apple', 'banana'];
var first = fruits[0];
> apple
var last = fruits[fruits.length - 1]; //此陣列長度為 2 , 但是索引是從 0 開始 [0]、[1]，所以須 - 1
> banana
更改陣列中某個元素的值
var fruits = ['apple','banana'];
fruits[0] = 'orange';
fruits[1] = 666;
console.log(fruits);
>['orange',666]
稀疏陣列 vs 密集陣列
密集陣列
陣列是一片連續的儲存空間，有固定的長度，密集陣列元素之間是緊密相連的，不存在空隙！
var megi = [9,4,5,6]; //緊密相連，裡面沒有空隙的陣列
稀疏陣列 （Sparse Array）
稀疏聽起來跟掉髮有關（並不是），稀疏陣列是指陣列中有插槽（slot）可能未定義其值或被略過而導致存放 undefined 元素的狀況！
const list = [];
list[0] = 'apple';
list[2] = 'banana';
console.log(list.length);
>3 //list[1]會變成 undefined，list.length 是 3
鍵值的強制轉型
若使用很像數字的字串當成鍵值來存資料，鍵值會被強制轉型為數字！
const list = [];
list[0] = 'Hello';
list['20'] = 'World';
console.log(list.length);
>21
length 長度永遠大於陣列最高索引數
為了保持這個不變式，會自動變為length + 1！
var a = [1,2,3];
a[10] = 1;
console.log(a.length) ;
>11 //想不到吧，居然不是 10
陣列常用內建函式
Push()
push()可以將值加入陣列的最後一個位置，沒有限制添加數量，添加內容用,隔開即可，加入後陣列長度會增加！使用
push()後會改變原本的陣列內容。
var a =[1,2,3,4,5,6];
a.push(7,8); //在這陣的最後位置添加 7,8
console.log(a);
>[1,2,3,4,5,6,7,8]
pop()
pop()會移除（取出）陣列的最後一個元素。使用
pop()後會改變原本的陣列內容。
var a = [1,2,3,4,5,6,7,8];
var b = a.pop();
console.log(a);
>[1,2,3,4,5,6,7] //被拿走最後一個元素的陣列
console.log(b); //被拿出的最後一個元素
>8
shift()
shift()會移除（取出）陣列的第一個元素。使用
shift()後會改變原本的陣列內容。
var a = [1,2,3,4,5,6,7,8];
var b =a.shift();
console.log(a);
>[2,3,4,5,6,7,8] //被拿走第一個元素的陣列
console.log(b)
> 1 //被拿出的第一個元素
unshift()
unshift()會將指定的元素添加到第一個位置。使用
unshift()後會改變原本的陣列內容。
var a = [1,2,3,4,5,6];
a.unshift(666,777,888);
reverse()
reverse()會將陣列反轉。
使用
reverse()後會改變原本的陣列內容。var a = [1,2,3,4,5,6,7,8]; a.reverse(); console.log(a); [8,7,6,5,4,3,2,1]
splice()
splice()可以移除或新增陣列的元素，他包含了三個參數，第一個是要移除或添加的序列號碼(必填)，第二個是移除的長度設定為0的話，就不會有元素被移除，第三個則是要添加的內容。
var a =[1,2,3,4,5,6];
a.splice(2,0,100);
console.log(a);
>[1,2,100,3,4,5,6] //沒有元素被清除，100被加到了位置 2
var a =[1,2,3,4,5,6,7,8];
a.splice(5,3,100,200,300);
console.log(a);
>[1,2,3,4,5,100,200,300] //100、200、300取代原本位置在 5、6、7的元素
－－－
join()
join()可以將陣列中的元素，藉由指定的字符合併，變成字串呈現，沒有指定則會用,合併喔！
var a = [1,2,3,4,5,6,7,8];
console.log(a.join());
>1,2,3,4,5,6,7,8
console.log(a.join(''));
>12345678
console.log(a.join('!!'))
>1!!2!!3!!4!!5!!6!!7!!8
map()
map()會建立一個新的陣列，內容為原陣列的每一個元素，經由回乎韓式運算後索回傳的結果之集合。
var a = [1,2,3,4,5];
var newa = a.map(x => x * 2);
console.log(newa);
>[2,4,6,8,10]
filter()
filter() 接收一函式，但函map不同的是，filter把傳入的函示依次作用於每個元素，然後根據返回值 true 還是 false 決定保留還是丟棄該元素。
var a = [1,2,3,4,5,6,7];
var r = a.filter(function(x){
return x % 2 !== 0;
});
console.log(r);
>[1,3,5,7]
var a = ['A','','B',null,'c',' '];
var r = a.filter(function(s){
return s && s.trim(); //.trim將字串去空白
});
console.log(r);
>["A","B","C"]
參考資料來源:
Lidemy 鋰學院-Huli老師的課程
你懂 JavaScript 嗎？#5 值（Values）Part 1 - 陣列、字串、數字
JS 陣列 Array 是什麼 ?
JavaScript Array (陣列)
javascript稀疏陣列(sparse array)和密集陣列用法分析
Javascript大全 - 05(一) 陣列
JavaScript Array 陣列操作方法大全
Array.prototype.map()
Javascript中關於Array.filter()的妙用詳解
