es6數組中可不可以用展開符

這篇文章主要講解了“es6數組中可不可以用展開符”，文中的講解內容簡單清晰，易于學習與理解，下面請大家跟著小編的思路慢慢深入，一起來研究和學習“es6數組中可不可以用展開符”吧！

es6數組可以用展開符。展開符“...”會將可迭代對象展開到其單獨的元素中，而所謂的可迭代對象就是任何能用“for of”循環進行遍歷的對象，例如數組、字符串、Map 、Set；當展開符用于數組，可以將一個數組轉為用逗號分隔的參數序列。

展開符（擴展操作符） … 是ES6中引入的，將可迭代對象展開到其單獨的元素中，所謂的可迭代對象就是任何能用for of循環進行遍歷的對象，例如：數組、字符串、Map 、Set 、DOM節點等。

展開運算符（spread operator）允許一個表達式在某處展開。展開運算符在多個參數（用于函數調用）或多個元素（用于數組字面量）或者多個變量（用于解構賦值）的地方可以使用。

es6展開符的使用（數組方面）

1、復制數組

給定一個數組，想要將一個數組的成員復制到另一個數組中，該怎么做？

const a = [1, 2];
const b = a;
console.log(b); // [1, 2]

真有表面上這么簡單嗎？試著修改一下a數組中的值

a[0] = 3;
console.log(b); // [3, 2]

誒？怎么我修改了a數組中的值，結果b數組中的值也變了？這里涉及到的是堆棧的原理，就不具體展開說了，你只需要知道簡單地使用兩邊相等的方式是不能完成數組的復制的，這里使用展開運算符就可以完成啦?

const a = [1, 2];
const c = [...a];
console.log(c); // [1, 2]
a[0] = 3;
console.log(c); // [1, 2]

2、合并數組

const a = [1, 2];
const b = [3];
const c = [4, 5];

console.log([...a, ...b, ...c]); // [1, 2, 3, 4, 5]
console.log([...c, ...a, ...b]); // [4, 5, 1, 2, 3]
console.log([99, ...a, 24, ...b, ...c]); // [99, 1, 2, 24, 3, 4, 5]

3、字符串轉為數組

前置知識：字符串可以按照數組的形式展開?

const name = 'Jae';
console.log(...name); // J a e

字符串轉數組除了用 split() 方法，也可以用展開運算符?

const name = 'Jae';
const name_string = [...name];
console.log(name_string); // ["J", "a", "e"]

4、常見的類數組轉化為數組

為什么要將類數組轉化為數組呢？因為類數組不能使用數組的方法，將其轉化過來對于一些對數據進行處理的需求就更加方便了 ~

• arguments

function func() {
	console.log(arguments);
}
func(1, 2); // Arguments(2) [1, 2, callee: ?, Symbol(Symbol.iterator): ?]

// 使用展開遠算符
function func() {
	console.log([...arguments]);
}
func(1, 2); // [1, 2]

• NodeList

<!--HTML代碼-->
<p>1</p>
<p>2</p>
<p>3</p>

const a = document.querySelectAll("p");
console.log(a); // NodeList(3) [p, p, p]
console.log([...a]); // [p, p, p]

感謝各位的閱讀，以上就是“es6數組中可不可以用展開符”的內容了，經過本文的學習后，相信大家對es6數組中可不可以用展開符這一問題有了更深刻的體會，具體使用情況還需要大家實踐驗證。這里是億速云，小編將為大家推送更多相關知識點的文章，歡迎關注！