一般來說，如果我們要合併陣列可以使用陣列內建的方法 concat 來合併陣列，但是我們也可以透過展開方式來合併陣列，我們可以使用 ...arr1 ,...arr2 來將陣列的值取出，並且將他們合併到一個陣列 arr3 中。
let arr1 = ['Leo','Peter','Amy'];
let arr2 = ['Alex','Ray'];
let arr3 = arr1.concat(arr2);
console.log(arr3);
let arr1 = ['Leo','Peter','Amy'];
let arr2 = ['Alex','Ray'];
let arr3 = [...arr1, ...arr2];//...將陣列的值取出
console.log(arr3);
如果我們今天將 arr2 陣列設定成 arr1 陣列，此時當我們將 arr2 陣列的值 push 一個值 Harry，此時我們如果使用 console.log 顯示出陣列，會發現 arr1 也增加了 Harry 的值，原因在於我們是傳 arr1 的參考給 arr2 ，因此當我們更動 arr2 的值，同樣也會修改到 arr1 的值。如果我們想要修改 arr2 的值卻不影響 arr1 ，此時我們將 arr2 設定成 [...arr1] ，陣列 arr2 就會設定成從 arr1 取出的值，但是不是傳參考，因此當 arr2 更改時，arr1 不會跟著變動。
let arr1 = ['Leo','Peter','Amy'];
let arr2 = arr1;
arr2.push('Harry');
console.log(arr1);
console.log(arr2);
// 傳參考
let arr1 = ['Leo','Peter','Amy'];
let arr2 = [...arr1]
arr2.push('Harry');
console.log(arr1);
console.log(arr2);
//shallow copy
如果我們使用 document.querySelectorAll('li') 來選取 li 元素，此時當我們用控制台打開 li 時，會發現il 裡面顯示是一個 NodeList ，它是一個類陣列，當我們如果仔細看裡面的東西會發現，少了很多陣列原生的方法，像是 concat。如果我們要將類陣列轉換成陣列，可以使用展開陣列的方式，像是 arrli = [...li] 來將累陣列變成陣列。
<body>
<ul>
<li>a</li>
<li>b</li>
<li>c</li>
</ul>
</body>
<script src="js/all.js"></script>
let li = document.querySelectorAll('li');
let arrli = [...li] ;
如果我們不知道要傳入的參數數量有多少，也可以在參數使用...用法，其餘參數用法，那麼它就會自動將參數轉換成陣列的形式。
function show(...money){
console.log(money);
}
show(100,400,500);
iThome鐵人賽
看影片追技術